Foundation Studio | Design System Generator

About this plugin

Foundation Studio is a Figma plugin that creates a complete base style system for your project in seconds. It removes manual setup and lets you start designing with a clean, consistent foundation from day one.

Color System

Generate a fully harmonized palette from a single primary color.

Semantic, text, and supportive colors are created automatically.

Supports primary, secondary, and tertiary colors.

Typography

Choose any font and instantly generate a complete type system

with balanced sizes, ratios, and line heights.

Customize the scale and define font pairing.

Spacing, Shadows & Radius

Build consistent spacing, shadow, and radius systems for your UI.

Export for Developers

Export tokens to CSS, SCSS, or JSON.

Documentation

Automatically generate a clear documentation page with all design tokens in one place.

Light & Dark Mode

Light and dark themes are generated from the same tokens,

ensuring readability and contrast across both modes.

⸻

🚧 Beta

Foundation Studio is currently in beta and actively evolving.

Feedback and ideas are always welcome.