Expense Tracker with Live Currency Conversion

A responsive expense tracker that uses live currency conversion, charts, dark mode, and JavaScript to help users track spending across currencies.

Context

Managing expenses across different currencies can be frustrating, especially when conversion rates constantly change. I built this tool to simplify that process and create a clean, intuitive way to track spending in real time.

What it does

This is a responsive expense tracker that allows users to log spending, select currencies, and instantly convert values using live exchange rates.

The app dynamically updates totals and visualizes spending through an interactive chart, giving users a clear overview of their finances without refreshing the page.

Key Features

  • Real-time currency conversion using live API data

  • Interactive expense tracking

  • Data visualization with charts

  • Dark mode toggle

  • Responsive design across devices

Impact

This project demonstrates how front-end development can go beyond static pages by integrating live data, interactivity, and real-world functionality.

It reflects my ability to build user-focused applications that combine clean design with practical features.

Design Approach

The interface was designed to feel simple, clean, and easy to navigate. I used a two-panel layout with clear visual hierarchy, soft shadows, and a calm color palette to guide the user’s attention.

Create a free website with Framer, the website builder loved by startups, designers and agencies.