Atomic by BigBasket

About this plugin

Built this to enhance design and development efficiency in BigBasket.

Atomic transforms a single hex code into a complete set of design tokens and themes, instantly applying your brand's unique identity across all your apps and websites. This powerful plugin streamlines multi-brand design systems and campaigns, allowing you to effortlessly generate themes, export developer-ready tokens, and maintain consistency across every product.

Features:

Theme Generator

Define your core brand colors and let Atomic intelligently adjust shades to create a complete palette. You can then export this palette directly to your Figma canvas or instantly generate Figma variables as a complete theme. This helps you create brand modes instantly with proper semantics, enabling faster iterations for brand campaigns and seamless experimentation with colors, fonts, and effects.

Export to JSON

Export all your Figma design tokens directly to JSON, providing developers with a consistent and up-to-date source of truth. This significantly speeds up hand-offs and reduces implementation discrepancies.

Effects

Precise shadow colors and configure them for smoother, more nuanced visual effects. Apply consistent effects across all your brands, updating global styles with ease.

Spacing & Radius

Establish a consistent visual rhythm and hierarchy using dedicated tokens for spacing and border radius. You can use default values or easily adjust them to perfectly align with your brand guidelines.

Neutrals and Semantics

Automatically generates essential primitives and neutral colors. These foundational elements are crucial for building a robust and flexible design system that scales across multiple brands.

Any feedback?

Connect at [email protected]