📖 Step 5: Design - Advanced UI/UX#122 / 291
Primary / Secondary
Primary / Secondary
📖One-line summary
Importance tiers for buttons and colors — primary is the most emphasized.
✨Example
Visual contrast between primary and secondary buttons
Primary = strongest emphasis, Secondary = supporting, Tertiary = least emphasis
⚡Vibe coding prompt examples
>_
Add primary, secondary, and tertiary variants to the Button component. Primary should be filled, secondary should be outlined.
>_
Write a function that auto-generates the full theme from primary and secondary colors. Auto-calculate lightness variations too.
Try these prompts in your AI coding assistant!