The dollar moved. What did that silently do to your money?
RupeeShift is an interactive financial analysis tool that makes the impact of USD/INR exchange rate movements visible, understandable, and actionable. The Indian rupee has depreciated significantly against the dollar over successive financial years — most people feel this intuitively but cannot quantify it.
RupeeShift answers that question across four real-world scenarios, using live exchange rate data from the European Central Bank, beautiful charts, and plain-English insights.
- Indian Subsidiary — See how much USD your company actually saved (or spent extra) on your INR payroll when the rupee weakened
- IT Exporter — Understand the FX-driven INR revenue uplift on your USD contracts and what that means for salary hikes
- Freelancer — Discover the "silent raise" your USD invoices gave you and plan smarter rate card renewals
- INR Employee — Quantify the real-terms erosion of your salary against the dollar and find your break-even increment
- Covers FY 2021–22 through FY 2025–26
- Live USD/INR rate data via the Frankfurter API (ECB), with session-cached fallback rates
- Month-by-month rate breakdown for every FY
- Monthly USD/INR rate line chart
- Month-by-month impact bar chart
- Increment/renewal scenario bar chart with break-even marker
- For each scenario, see exactly what different % hikes or contract renewals mean in real USD/INR terms
- Break-even percentage clearly highlighted — the minimum needed to hold your position
- Download full scenario analysis as
.xlsx(Excel) or.csv - Includes monthly breakdown, summary, and increment table
- Warm editorial design inspired by premium financial tools
- Fully responsive — works on mobile (375px) through large desktop
- Framer Motion animations with
prefers-reduced-motionsupport - Keyboard navigable, semantic HTML, ARIA labels throughout
| Layer | Technology |
|---|---|
| Framework | React 19 + Vite 8 |
| Styling | Tailwind CSS v4 (@tailwindcss/vite) |
| Charts | Recharts |
| Animations | Framer Motion |
| Excel Export | SheetJS (xlsx) |
| Icons | Lucide React |
| Exchange Rate API | Frankfurter (ECB data, no auth required) |
| State Management | React Context + useReducer |
| Fonts | DM Serif Display, DM Sans, DM Mono (Google Fonts) |
rupee-shift/
├── public/ # Static assets (rupee-shift-icon-filled, etc.)
├── src/
│ ├── components/
│ │ ├── charts/ # Recharts-based chart components
│ │ ├── layout/ # Navbar, Footer, FYSelectorBar, InsightStrip
│ │ ├── logo/ # RupeeShiftLogo SVG component
│ │ ├── modals/ # About and Methodology modals
│ │ ├── scenarios/ # Scenario panels (Subsidiary, ITExporter, Freelancer, INREmployee)
│ │ └── ui/ # MetricCard, SliderControl, SectionCard, StatusTag, etc.
│ ├── context/ # AppContext (global state) + AnimationContext
│ ├── data/ # fyConfig.js — FY definitions and fallback rates
│ ├── docs/ # Product requirements document
│ ├── hooks/ # useExchangeRates, useCountUp
│ ├── sections/ # HeroSection, ScenarioSection (page-level sections)
│ └── utils/ # calculations, formatters, rateHelpers, exportExcel, animations
├── index.html
├── tailwind.config.js
└── vite.config.js
- Select a Financial Year from the top selector bar (FY 2021–22 through FY 2025–26)
- Pick your scenario — Subsidiary, IT Exporter, Freelancer, or INR Employee
- Adjust the sliders — enter your salary, revenue, or contract value
- Read the insight — the banner at the top of each scenario explains what happened in plain English
- Explore the charts and tables — month-by-month breakdown with cumulative impact
- Use the increment analyser — find your break-even hike percentage
- Export your full analysis to Excel or CSV
Contributions are welcome! Please read CONTRIBUTING.md for guidelines on how to get started.
This project is licensed under the MIT License — see LICENSE for details.
Built by Nishad Kindre