veritaQuotes

The shortest path from blank screen to shareable card:

1. Open the Library tab and click any quote — the app jumps to the Designer with that quote pre-loaded.
2. In the Designer, scroll the Templates strip and click a tile to try a look. Each click instantly re-renders the canvas on the right.
3. Tweak text, colors, or backgrounds in the Customize panel (expand it under the template picker).
4. Hit PNG, JPG, or SVG in the canvas toolbar to save the finished card to your Downloads folder.

Tip: If something goes sideways, the Undo button in the canvas toolbar remembers your last 50 edits.

The Library is pre-seeded with a selection of literary quotes and the full King James Bible. Above the list you'll see a search box and a source filter.

• Search matches the quote text, author, and reference. Try typing a book name like Psalm 23 or a word like hope.
• The source dropdown narrows to Literary, KJV Bible, or your own saved quotes. "All sources" shows everything.
• Clicking a quote row jumps straight to the Designer with that quote loaded — handy when you're browsing for a verse to share.

The KJV Bible ships embedded in the HTML file, so searches work offline with zero latency — no network round-trip, no API key.

The Create tab is a three-field form: quote text, primary attribution (author or speaker), and optional secondary attribution (source, date, or work). Submitting saves the quote into your browser's IndexedDB and opens the Designer with it selected.

Your saved quotes appear in the Library under the My quotes source filter, and persist across browser sessions — unless you clear site data for the page, in which case they're gone (the tradeoff for a fully-offline, single-file app).

The Designer is split into a sidebar (left) and the canvas (right). The sidebar holds the current quote, the templates strip, and the collapsible Customize panel. The canvas is a live SVG preview — what you see is exactly what exports.

• Templates strip: thumbnails of every built-in design plus any you've saved. Use the category chips (Minimal, Classical, Modern, Elegant, Nature, Velvet, Decorative, Effects, Harvest, Script, My Templates) to narrow the list.
• Quote / Attribution inputs: edit the text without leaving the card. Changes stream into the canvas as you type.
• Click a text block on the canvas to select it — a dashed ring shows the current selection. Drag to move it around. Double-click to edit the text inline.

The Customize panel is organized as five tabs. Each one edits a different layer of the card without touching the rest:

• Quote — font family, size, weight, style, color, alignment, line height, letter spacing, max-width, text shadow, outline/stroke, gradient fill, image fill, and curved/arc text.
• Attribution — the same controls as Quote, but for the credit line. You can style them independently.
• Frame — decoration layer. Ten types to choose from: quote marks, divider, corners, cross emblem, border frame, ornate frame, polaroid, ribbon, art deco, or none. Each exposes color, stroke width, inset, and radius.
• Background — pick a solid color, gradient, radial gradient, repeating pattern (dots / cross / stars / lines / grid), nature scene, effect background (splash / cloud / aurora / confetti), or upload your own image.
• Save — store the current design as a reusable template (see section 10).

Customize overrides sit on top of the template — switching templates clears them. Think of it as a transparent sheet laid over the design; pick up the sheet and you're back to the original.

The Background tab supports ten types. Here's a quick field guide:

• Solid — one flat color. Cleanest readable surface.
• Gradient — a linear blend between two or more color stops. Good for sunrise / sunset / subtle editorial washes.
• Radial — a circular gradient, brighter in the middle (or wherever you put the center). Spotlight effect.
• Pattern — repeating dots, crosses, stars, lines, or a grid over a base color. Good for devotional or craft vibes.
• Scene — vector nature renderings: mountain peaks, waterfall, meadow, forest stream, dunes, shore, cherry blossom. Zero external images, fully procedural.
• Splash — watercolor-like blobs.
• Cloud — soft bokeh / fog.
• Aurora — layered ribbon bands across a deep sky.
• Confetti — scattered specks over a base color.
• Image — upload a photo. It's fitted to the canvas and processed entirely in-browser — the image never leaves your machine.

The font picker under the Quote and Attribution tabs lists every font stack the app recognizes. The groups:

• Classical serifs — Georgia, Times, Palatino, Baskerville, Garamond, Hoefler, Perpetua, Lucida Bright.
• Display serifs — Big Caslon, Didot, Bodoni, Trajan, Copperplate.
• Sans-serif — Optima, Avenir, Futura, Helvetica, Tahoma, Verdana, System Sans.
• Heavy display — Impact.
• Monospace — Courier, Menlo.
• Script / Handwritten (new in v26.4.12) — Brush Script, Chancery (Calligraphy), Casual Hand, Marker Felt, Chalkboard. Showcased in the Script family with four starter templates: Handwritten Note, Brush Elegance, Chancery Gold, Chalkboard.

Each entry is a CSS font-family chain — the browser picks the first one you have installed. If a machine has none of the named fonts, the cursive / serif fallback keyword at the end keeps the overall look consistent.

The Quote and Attribution tabs expose a handful of text effects:

• Shadow — controls for x/y offset, blur, and color. Good for boosting readability over busy backgrounds.
• Outline / stroke — a stroke width and color trace the text. Pair a dark stroke with light text for a chalk-on-slate effect.
• Gradient fill — fill the glyphs themselves with a gradient instead of a flat color.
• Image fill — upload an image and it's masked inside the text shapes.
• Curved text — bend the quote or attribution along an arc. Useful for circular seals or pennant looks.

Above the canvas, the toolbar bundles the most frequent actions:

• Undo / Redo — a 50-step ring buffer of every template switch, override, drag, and inline edit.
• Reset layout — snaps the quote and attribution back to their template-default positions without losing your other overrides.
• Aspect — Square 1:1 (Instagram), Story 9:16 (Stories / Reels), Twitter 16:9, Pinterest 2:3. Changes the canvas viewbox; templates re-flow into the new shape.
• PNG — lossless, keeps transparency. JPG — smaller, opaque, fastest to upload. SVG — vector, infinitely scalable, editable in Illustrator / Inkscape.

Built a design you want to reuse? Open the Customize panel's Save tab, give it a name, and click Save.

• Saved templates show up under the My Templates category chip in the Designer's templates strip.
• They persist in IndexedDB alongside your custom quotes.
• Each saved template captures the full design state: template base, every override, plus current offsets for the text blocks.
• You can delete a saved template from its tile's menu.

• Click a text block to select it (dashed ring).
• Drag a selected block to move it.
• Double-click a text block to edit its text inline without leaving the canvas.
• Click empty canvas to deselect.
• Undo / Redo — via the toolbar buttons. Each template swap, override edit, or drag is one step.

VeritaQuotes is a single HTML file. It makes no network calls at runtime — no CDN pulls, no analytics, no telemetry. Open it once online (or copy the file locally) and it keeps working on planes, trains, and anywhere else without wifi.

All state — your custom quotes, saved templates, and settings — lives in your browser's IndexedDB for this origin. Clearing site data or using a different browser profile gives you a blank slate. Uploaded images are held only in memory for the session and in the exported file; they're never sent anywhere.

• Fonts look wrong. Font stacks depend on what's installed locally. If Brush Script or Chancery isn't on your OS, the browser falls through to its generic cursive — still a script face, just not the exact one named.
• Export button doesn't download. Some browsers block downloads from file:// URLs or in private / incognito windows. Open the file over http (even a local server) or allow downloads for the page.
• My quotes / templates vanished. IndexedDB is scoped per origin and per browser profile. Clearing site data, switching browsers, or moving the HTML file to a new URL will give you a fresh database.
• Performance feels slow on big photos. Uploaded images are rendered at full resolution into the SVG. Downscale huge photos (e.g., > 4K) before uploading.
• Customize tab changes don't stick. Overrides are cleared when you switch templates — by design, since the new template may have a completely different layout. Use Save to preserve a design you like.