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 SystemGenerate a fully harmonized palette from a single primary color.Semantic, text, and supportive colors are created automatically.Supports primary, secondary, and tertiary colors.TypographyChoose any font and instantly generate a complete type systemwith balanced sizes, ratios, and line heights.Customize the scale and define font pairing.Spacing, Shadows & RadiusBuild consistent spacing, shadow, and radius systems for your UI.Export for DevelopersExport tokens to CSS, SCSS, or JSON.DocumentationAutomatically generate a clear documentation page with all design tokens in one place.Light & Dark ModeLight and dark themes are generated from the same tokens,ensuring readability and contrast across both modes.⸻🚧 BetaFoundation Studio is currently in beta and actively evolving.Feedback and ideas are always welcome.