Atmos vs ColorBox
Atmos
atmos.styleColorBox
colorbox.ioSide by side
| Figure | Atmos | ColorBox |
|---|---|---|
| Price from | — | Free |
| Free plan | — | Yes |
| Free trial | Yes | — |
| Open source | — | — |
| Web | Yes | Yes |
| Plans published | 2 | 1 |
| Spec score · Color Palette Generators | 7.9 (#8) | 7.9 (#11) |
| Color spaces | The playground supports color spaces including LCH and OKLCH, and gamut limits including sRGB and Display P3. | The web app lists HSV and OKLCH as color-space modes. |
| Purpose | Atmos is a color palette tool built with UI designers in mind. | ColorBox is a tool for creating color systems and accessible palettes. |
Plans
In their own words
Atmos
Atmos is a color-palette tool for UI designers, offered as a web app and extension. It includes a color generator, wheel, shade generator and playground for creating and refining palettes. The playground supports LCH and OKLCH color spaces with sRGB and Display P3 gamut limits. Its contrast checker covers APCA (WCAG 3) and WCAG 2. Users can save palettes, maintain a brand color library, work with print color and share palettes with teammates. Exports include SVG, Figma, CSS, JavaScript, JSON, Tailwind CSS, Style Dictionary, Design Tokens and Raw, with HEX, HSL, RGB, CMYK, LCH and OKLCH values. Atmos provides a Figma plugin; Pro adds palette syncing with Figma. The free plan allows one project, while Pro offers unlimited projects and all features. A 14-day trial needs no credit card but limits exports to SVG. Atmos is made by RBND studio.
ColorBox
ColorBox is a free web tool and extension for creating color systems and accessible palettes. You can adjust multiple colors in one tab and share a system as a URL or JSON file. Contrast indicators show 3:1, 4.5:1, and 7:1 levels for color sets, while HSV and OKLCH provide color-space modes. Auto Dark Mode creates an inverted set from original inputs; duplicated sets can also be edited manually. Hue progression rotates clockwise or counterclockwise. Export options include Config, Output, Tailwind, CSS, OKLCH, and Swift. The maker describes importing systems into Figma through a plugin and JSON, with custom step names and generated Paint Styles. A Sketch route uses that Figma workflow, then SVG export. The color algorithm can be consumed through NPM with exported JSON for code generation. Custom curves were described as unavailable in ColorBox at the cited time. The free plan is ad-free.