They are named RGBA values derived from your brand color with controlled α steps (5%–95%). They keep translucency consistent across components and themes.
Names map to percent α values. a05 = 5%, a10 = 10%, … a95 = 95%. This keeps tokens sortable and predictable.
Use CSS variables for runtime theming in web apps. Use JSON tokens for cross‑platform pipelines or when exporting to native apps and docs.
Output uses RGBA for clarity and widespread support. You can convert RGBA → HEXA in your build if required.
Reference variables in utilities, e.g., bg-[var(--brand-a20)] or create custom utilities in tailwind.config using the generated values.
Yes. Configure Min, Max and Step. The grid and code update instantly; tokens follow your exact range.
Yes. All processing happens in your browser. No data is transmitted or stored.
Modern evergreen browsers including Chrome, Edge, Firefox, and Safari.