Cardforge
CardForge is a calm, premium React design tool for creating, previewing, and exporting print-ready business cards.
- Status
- Live
- Updated
- Sep 2026
- Tools
- Shell, JavaScript, HTML, TypeScript, CSS

The problem
CardForge is a calm, premium React design tool for creating, previewing, and exporting print-ready business cards.
What I built
CardForge is a local-first React studio for designing, previewing, and exporting print-ready and digital business cards — from buttoned-up professional layouts to bold gradient/neon/oversized-type cards.
How it works
- Freeform editor — add, delete, duplicate, drag, resize, rotate, layer, align, and lock text, shapes, images, and QR codes. Whole drags are a single undo step.
- Real typography — 10 self-hosted typefaces (via @fontsource) with curated heading/body pairings, so every template renders in its true typeface, online or offline.
- True card geometry — the canvas tracks each preset's real aspect ratio (US, EU, JP, UK, square, mini; landscape/portrait) instead of forcing everything into a landscape box.
- Digital cards — share a link or QR that opens a tappable digital card and saves the recipient's contact. New links keep the filtered design in the URL fragment so ordinary hosting requests do not receive it.
- Private sharing controls — choose exactly which contact fields, pronouns, tagline, and images enter a link; optionally expire the card and disable vCard downloads.
Tradeoffs and limits
The live build is a portfolio demonstration. Availability and external services can vary, and the repository remains the source of truth.
What I learned
It runs anonymous-first in the browser, saves designs locally, and exports PDF (with bleed + crop marks), PNG, SVG, vCard, QR, and .cardforge.json files without requiring an account.