FX Margin Lens

FX Margin Lens helps Canadian importers compare USD payment quotes, expose FX costs, find the rate where target margin breaks, and calculate a safe selling price.

Comment 2

Inspiration

Canadian small businesses can agree to a profitable international order and still lose much of that margin by the time a USD supplier is paid. The problem is not only the exchange rate: businesses may face provider spreads, transfer fees, unknown intermediary-bank charges, and currency movement between quoting and settlement.

I wanted to build something more useful than a basic FX calculator.

The key question became:

How far can USD/CAD move before this specific order stops meeting the business's target margin?

That became FX Margin Lens, built for MuslimHacks 2026 — Challenge 2: International Trades.

What it does

FX Margin Lens is a decision-support dashboard for a Canadian business paying a supplier in USD while earning customer revenue in CAD.

The user enters:

  • USD supplier invoice
  • expected CAD customer revenue
  • other known order costs
  • target profit margin
  • a reference USD/CAD rate
  • two payment-option quotes and their known fees

The app then:

  • compares the disclosed cost of two payment options
  • exposes the FX spread versus a reference rate
  • separates costs into Known, Estimated, and Unknown
  • calculates order profit and profit margin
  • identifies the Profit Cliff — the highest effective USD/CAD rate that still preserves the target margin
  • lets the user test different FX scenarios interactively
  • calculates the Safe Selling Price needed to preserve the target margin
  • produces a plain-language Decision Lens
  • includes a compact Sharia-aware educational section

For the built-in demonstration scenario, a C$33,000 customer order with a US$20,000 supplier invoice and a 12% target margin produces a Profit Cliff of 1.4010 CAD per USD for the selected FX Specialist option.

The Profit Cliff is not an exchange-rate prediction. It is a deterministic threshold calculated from the economics of the order.

Why it is different

A normal currency calculator can tell a business:

US$20,000 × 1.39 = C$27,800.

FX Margin Lens goes further and answers:

How much FX deterioration can this order actually survive before my required margin breaks?

It also avoids false precision. If intermediary or receiving-bank fees cannot be reliably known before a transfer, the app labels them UNKNOWN instead of inventing a number or silently assuming zero.

The goal is not to predict FX markets. It is to make an international trade decision easier to understand.

How I built it

I built the project solo during the MuslimHacks 2026 competition period.

The frontend is built with:

  • React
  • TypeScript
  • Vite
  • custom responsive CSS

The financial engine uses deterministic TypeScript functions for quote comparison, profit, margin, Profit Cliff, scenario analysis, and Safe Selling Price.

The app can optionally retrieve the latest daily USD/CAD reference observation from the Bank of Canada Valet API. A manual reference rate always remains available, so the complete workflow still works if the external request fails.

I used GitHub Spec Kit to structure the product specification, requirements, implementation plan, and acceptance criteria, and OpenAI Codex as an AI coding assistant during implementation and testing.

Testing includes:

  • Vitest deterministic financial tests
  • Playwright end-to-end desktop and mobile tests
  • boundary and validation testing
  • production smoke testing after deployment

The final application is deployed on Vercel.

Challenges I ran into

The hardest part was not building the interface. It was defining the financial model carefully enough that every number had a clear meaning.

I had to keep one currency convention everywhere:

1 USD = X CAD

I also had to ensure that unknown fees were never treated as zero, that display rounding never affected threshold calculations, and that invalid inputs could never produce NaN, Infinity, or misleading financial results.

Another challenge was making the Profit Cliff understandable to someone without a finance background. I wanted the user to immediately see the decision boundary rather than just receive another table of calculations.

During the final bug hunt, testing found a validation issue where invalid payment-option fields were correctly rejected but not clearly highlighted. I fixed it, added field-level errors and accessibility states, reran the full test suite, and redeployed the verified fix.

Accomplishments that I'm proud of

I am especially proud that the project was completed solo while keeping the scope disciplined.

The final product includes:

  • a complete end-to-end decision flow
  • a memorable Profit Cliff concept
  • Safe Selling Price calculations
  • transparent Known / Estimated / Unknown cost treatment
  • Bank of Canada reference-rate integration with manual fallback
  • responsive desktop and mobile UI
  • automated financial and end-to-end testing
  • public documentation and competition disclosures
  • a production deployment

I am also proud that the app deliberately avoids claiming certainty where certainty does not exist.

Sharia-aware design

Because this was built for MuslimHacks, I also included a small educational section for businesses seeking a Sharia-conscious approach.

It highlights approaches to explore such as:

  • spot currency exchange
  • natural / operational hedging
  • supplier and payment-term planning

The section references AAOIFI's standard on Trading in Currencies and the Islamic Financial Services Board.

It does not certify Sharia compliance and does not issue a fatwa. Actual treatment depends on transaction structure and scholarly interpretation.

What I learned

This project reinforced that a useful fintech product does not need to predict markets or automate transactions.

Sometimes the most valuable product is one that makes the user's decision boundary visible.

I also learned the value of specification-driven development. Defining the formulas, edge cases, trust language, acceptance scenarios, and failure behavior before finalizing implementation made testing much more systematic.

What's next

Possible future extensions include:

  • saving and comparing multiple orders
  • additional currencies
  • historical scenario visualization
  • configurable cost categories
  • exportable decision reports
  • deeper payment-provider integrations where reliable data is available

For this hackathon MVP, I intentionally kept the product focused on one question:

Before committing to an international order, how much FX risk can the margin actually survive?

Built With

Share this project:

Updates

Submission history