Skip to content
Atomica

Atomica

by Mohamed Ismail

AI-powered color systems and design tokens

FreeFigma

Installs

0

Likes

0

Users

3

Views

20

Preview

Atomica preview

About this plugin

Atomica turns a brand, a mood, or a single base color into a complete, professional color system, powered by AI and OKLCH color science. Generate a full palette of tints, shades, and tokens, then ship it as Figma variables, color styles, and code, all inside Figma.

Features:AI Color Generation: describe a brand, mood, or style and get a complete, curated palette in seconds.OKLCH Color Science: perceptually uniform tints and shades with precise gamut mapping.

Design Token System: Primitives, Alias, Semantic, and Component token layers.

Figma Variables and Color Styles: create native Figma variables and styles in one click.

Documentation Frames: auto-generate visual documentation with swatches.

8 Export Formats: DTCG JSON, Tailwind config, CSS Variables, SCSS, Swift (UIColor), Kotlin (Compose), Flutter (Dart), and Markdown.

Preview Layouts: Grid, Card, Stripe, and Table, on light or dark canvas.

Tailwind Integration: import from Tailwind's full palette.

Contrast Checking: WCAG ratio badges on every grade.

How to use:

Run the plugin and describe your color needs to the AI, or pick a base color manually.

Add colors to your Primitives collection. Tints and shades are generated automatically.

Build token layers (Alias, Semantic, Component) to create a full design system.

Click "Create collection" to generate Figma variables, styles, and documentation.

Export to your preferred format from the Code tab.

Support: desmismail@gmail.com

More shapes colors plugins

View all