Markup
Plain HTML
The app is a single HTML document that defines the entire interface, including the form, results panels, help button, and modal content. There is no framework or component system involved.
Main Stack
What powers this calculator and how lightweight the implementation is.
Styling
Custom CSS
The visual design is handled by one standalone stylesheet. The project uses a strong custom look, responsive rules, and imported typography without relying on Tailwind, Bootstrap, or a build pipeline.
Logic
Vanilla JavaScript
The calculator logic runs directly in the browser through plain JavaScript functions. Input validation, calculation, DOM updates, and modal behavior are all implemented without external libraries.
Domain logic
Tax and FX calculation
The app focuses on converting buy and sell values with PTAX exchange rates, estimating gross profit, tax, IOF, and net values for US stock transactions from a Brazilian tax perspective.
External reference
BCB PTAX context
The calculator links users to the Central Bank of Brazil PTAX history page and explains which PTAX direction is relevant for buy and sell operations. It does not automate that lookup itself.
Runtime model
No build step
This project is fully static. It can be opened directly in a browser or served from any simple static server, which makes it very easy to run and deploy.
How It Runs
The whole app executes client-side inside one browser page.
1
The browser loads one HTML page
The interface, labels, input fields, result areas, and modal markup are all embedded directly in index.html.
2
The stylesheet defines the UI
styles.css provides the entire visual layer, including layout, typography, button styling, modal appearance, and mobile adjustments.
3
User input drives the calculation
When the user enters PTAX and transaction values and clicks the calculate button, inline JavaScript validates the inputs and computes the currency-converted totals.
4
The page updates result fields
The app writes the computed values directly into DOM nodes for acquisition value, sale value, gross profit, taxes, net profit, and percentage analysis.
5
Modal content stays in-page
The explanatory help modal is implemented in the same document and toggled with simple DOM class and display changes rather than a framework component system.
Architecture Map
This project is structurally simple: one page, one stylesheet, one inline logic layer.
Key files
index.htmlMain interface markup, modal markup, and inline calculation logic.
styles.cssFull visual design, layout rules, typography, and responsiveness.
tax.icoProject favicon asset.
Architecture Analysis
index.html styles.css tax.ico
The whole project is essentially a self-contained browser application. That makes it low-maintenance, but also means structure and scalability are limited compared with component-based apps.
Data and Logic
The calculator is input-driven and does not rely on persisted storage or backend services.
Computation
All results are derived in the browser
The user supplies exchange rates and transaction values manually.
The JavaScript logic validates the fields before any results are shown.
Profit, IOF, and tax calculations are computed immediately in-page.
No data is sent to a backend or saved to a database.
Reference model
Educational and simulation-oriented
The interface links out to BCB PTAX historical data.
The modal explains why different PTAX sides matter for buy and sell operations.
The calculator is framed as a simulation aid rather than an authoritative tax engine.
The page explicitly advises consulting a specialized accountant.
Run Commands
No framework dev server is required unless you want one.
Local usage
open index.html # or python -m http.server
You can open the file directly in a browser or serve it with any very small static server if you prefer a local URL-based workflow.
Environment setup
What the project expects
No package manager or dependency installation step.
No environment variables.
No API keys.
No backend runtime.
Bottom Line
Capital Gains Calculator is a plain static web app built with HTML, CSS, and vanilla JavaScript. Its strength is simplicity: everything runs in the browser, there is no build step, and the domain logic is focused tightly on one financial/tax calculation workflow.