Design Project Starter Kit

About this plugin

Start your next website, app or product with colors, typography and UI components that work together.Design Starter Kit brings a color palette generator, typography scale generator and component library builder into one Figma plugin. Create the foundations of a design system without setting up every style and component by hand.Find your colorsChoose a base color or explore starting points for 12 industries. Generate a five-color brand palette, lock the colors you like and adjust individual shades. Undo and redo changes while you explore.Create primary shades, matching neutrals and semantic colors for success, warning, error and information. Add 34 colors to your file as Figma Variables or Paint Styles for a reusable set of color design tokens.Check contrast against light and dark backgrounds and preview common color vision differences. These previews help you review your choices. They do not replace a full accessibility audit.Build your typographyChoose a font available in Figma, set your base size and pick a modular scale. Preview nine text sizes from caption to display, with line heights tuned to each size. Save the result as reusable Text Styles for headings, body copy and small text.Create your UI kitPick the components you need from 13 families. Generate buttons in three sizes, icon buttons, toggle switches, checkboxes, radio buttons, form fields, select fields, quantity steppers, cards, tabs, badges, alerts and avatars.Get Figma component sets with Auto Layout, editable properties and key size and state variants. Add an organized board to your canvas and find the components in local Assets. Include sample instances when you want a starting point you can use straight away.The full catalog includes 256 variants. Choose a few essentials or generate the whole starter UI kit.Use your own styleComponents use the color and font you choose in the plugin or suggest a match from your file. Review the source, make an adjustment and generate a kit that fits your project.Everything runs inside Figma without network requests. Existing components stay untouched, and you can undo the latest generated kit while the plugin remains open.Built for UI design, UX design, wireframes, prototypes, mobile apps, websites and the first version of your next design system.