Workflow Overview
The current ChromaForge interface is organized around four practical stages: Source, Forge, Validate, and Ship. The Workflow surface near the top of the palette detail view gives you live metrics and quick jumps into the deeper tools.
| Stage | What you do | Where it takes you |
|---|---|---|
| Source | Create a palette, duplicate one, sample a photo, import files, or extract colors from a website. | Opens the Import panel and shows how many stops are available. |
| Forge | Edit stops, lock anchor colors, and generate harmonies in perceptual OKLCH space. | Jumps to the Generate controls and stop-editing workflow. |
| Validate | Check WCAG contrast, non-text contrast, color-vision simulations, APCA-style readings, and the system audit. | Opens Accessibility and System Audit, then scrolls to validation. |
| Ship | Compile colors into theme modes, semantic tokens, component aliases, Figma handoff, framework exports, and CI-friendly files. | Opens Developer Handoff and Export. |
Recommended path: Source a palette, forge the ramp, validate the theme, then ship tokens. The guide is now split into pages that follow that same path.
Current Library, Store & Editing Updates
The current build adds faster palette-library management, safer detail editing, StoreKit-backed purchases, and clearer Free plan limits. Use these controls when you are branching palettes, comparing directions, testing exports, or validating the release purchase flow.
- Sort menu: order the sidebar by Favorites, Newest, Oldest, Name, Most Stops, Fewest Stops, Type, Color Space, or LUT Size.
- Palette actions: duplicate, restore eligible built-in palettes, or toggle favorite from the toolbar actions menu, row context menu, or row swipe actions.
- Restore Factory: return an edited built-in palette to its original factory definition when the restore command is enabled.
- Undo Last Palette Change: use the curved-arrow button in the detail header and editable panels to step back through recent changes to the selected palette.
- Distribute stops: evenly space all stops across the palette while preserving their current visual order.
- Free export counter: Free includes 5 basic exports; the counter advances when you share a free export.
- StoreKit purchases: Pro Monthly, Pro Annual, and Founder Lifetime load App Store products, use verified transactions, and support Restore Purchases.
Color Compiler Pipeline
ChromaForge is organized like a compiler instead of a simple swatch picker. The workflow buttons are the user-facing path; the compiler pipeline is what ChromaForge does underneath.
| Compiler stage | What happens | Typical output |
|---|---|---|
| Source | Build a palette manually, duplicate an existing palette, sample a photo, import palette files, or extract colors from a website. | Color stops with positions, notes, source recipe, color space, and LUT metadata. |
| Normalize | Represent colors as RGB, Display-P3 CSS, CIELAB, CIELCH, OKLab, and OKLCH so ChromaForge can reason about perceptual behavior, browser color syntax, and wide-gamut handoff. | Modern swatch diagnostics, CIE/OK perceptual readouts, and consistent export strings. |
| Analyze | Check WCAG contrast, non-text UI contrast, color-vision resilience, APCA-style readability, palette depth, and export readiness. | AA pair counts, weakest/best pairs, Lc readings, warnings, failures, and readiness score. |
| Map | Compile primitive stops into semantic roles, component tokens, framework-specific aliases, and Figma variable groups. | Light, dark, and high-contrast token matrices. |
| Emit | Export raw palette data, CSS, framework themes, native app code, design-token JSON, Figma Variables JSON, CSV, or audit output. | Files or text snippets ready for design handoff, developer handoff, and CI checks. |
Working model: A palette can be beautiful and still fail as a product color system. ChromaForge helps you catch that before those colors become app code or Figma variables.
First Run & Interface Tour
Main areas
- Sidebar: palette list, segmented filter, Sort menu, search field, palette actions menu, row context menus and swipe actions, New Palette button, and plan/upgrade button.
- Palette detail: editable palette name, subtitle, favorite star, undo command, kind, color space, stop count, and locked-stop count.
- Workflow surface: Source, Forge, Validate, and Ship buttons with live metrics and quick jumps into the relevant panels.
- Gradient canvas: large preview that can add stops by tapping or clicking along the gradient.
- Stops: each stop has a color picker, hex readout, position slider, lock toggle, and delete button.
- Generate: harmony picker plus Generate Unlocked button.
- Preview and panels: context preview, render preview controls, Import, Accessibility, System Audit, Developer Handoff, Export, and Notes. Import opens by default so new work starts with a source.
What the starter palettes show
- Glass Nebula: P3 blues and orchid highlights for atmospheric wide-gamut testing.
- Polished Gold: metallic warmth for exact LUT and step marker checks.
- Misty Woods: calmer sRGB greens and fog tones for interface previews.
- Electric Coral: saturated neon colors for stress-testing dithering and exports.
Native Mac App
The Mac app uses the macOS menu bar, window sizing, scrolling, and sheet conventions expected from a native desktop tool. It is designed as a real Mac app, not an iPad layout dropped onto the desktop.
Window, scrolling, and sheets
- The app opens at a practical Mac document-style size with enough room for the palette sidebar and detail editor.
- The window has a minimum size that keeps the main controls usable while resizing.
- Two-finger trackpad scrolling works through the palette detail view, with visible scroll indicators and click targets that do not block normal scrolling.
- Mac sheets include visible Close buttons and support the Escape key.
View, Tools, and Help menus
- Use View > Show Sidebar and View > Show Toolbar for standard Mac layout controls.
- Use View > Jump to Detail Section, or Command-0 through Command-5, to jump to Workflow, Source, Forge, Validate, Ship, and Notes.
- Use View to expand or collapse detail panels and toggle Exact LUT Preview, Step Markers, and Dithering Preview.
- Use Tools > CLI Utility to view command-line audit examples, or Tools > Copy CLI Audit Command to copy the starter audit command.
- Use Help > ChromaForge User Guide for this guide and Help > ChromaForge Website to open the website.
Plans & Feature Availability
ChromaForge is free to explore, with Pro plans for production-ready color-system workflows. Paid options use StoreKit 2 product loading, verified purchases, current entitlements, transaction updates, and explicit purchase restoration.
| Plan | Price | Included |
|---|---|---|
| Free | $0 forever | 5 custom/imported palettes, 5 basic exports, 2 website imports, photo import, basic contrast checks, JSON export, Mandelbrot Metal export, and raw CSS variable export. |
| Pro Annual | $19.99/year launch price | Unlimited palettes/imports, theme matrix, primitive/semantic/component tokens, one-click AA repair, Component Preview Lab, system audit, role mapping, palette diffing, and all advanced exports. |
| Pro Monthly | $2.99/month | Same Pro feature access with flexible monthly billing. |
| Founder Lifetime | $49.99 one time | All Pro features for early supporters and future 1.x updates. |
How to open pricing
- Open ChromaForge.
- Tap the leading toolbar button in the sidebar. It shows Upgrade on Free and the active plan name on Pro.
- Review Free, Pro Annual, Pro Monthly, and Founder Lifetime.
- Choose a paid plan to start the App Store purchase flow.
- Use Restore Purchases if you already bought ChromaForge Pro on the current Apple Account.
StoreKit product IDs: com.mandelbrot-metal.chromaforge.pro.monthly, com.mandelbrot-metal.chromaforge.pro.annual, and com.mandelbrot-metal.chromaforge.founder.lifetime. If App Store Connect metadata is missing or still propagating in sandbox, the affected purchase button shows as unavailable.