20 powerful examples for Melinda Maria
Copy, tweak, make them yours. Just describe the task — Claude loads the skill automatically.
01"Build a Melinda Maria design-token set from our brand guide — lavender, deep plum, hot pink, IvyMode and SemplicitaPro, and our spacing scale — and give me the CSS variables to use across the onboarding hub."
02"Take our current onboarding-hub styles and pull all the hard-coded colors and fonts into a clean token system, so changing the hot-pink accent once updates every page at the same time."
03"Create light and dark theme tokens for an MM landing page that stay on brand in both modes, with accessible contrast, and show me how a button would reference them instead of raw hex codes."
04"Set up a shared token theme our future product pages and email templates can all pull from, document each token in plain English, and flag any color pair that would fail accessibility contrast."
05"Define a full color-token scale from our three brand hexes — tints and shades of lavender, plum, and hot pink — plus semantic tokens like ‘button-primary’ and ‘link’ so designers stop picking random shades."
06"Build typography tokens for IvyMode (display) and SemplicitaPro (body) — sizes, weights, and line-heights for h1 through small print — as reusable variables for the hub and landing pages."
07"Create a spacing and radius token scale (4/8/12/16/24…) so every MM page uses consistent padding and rounded corners, and show me a card component referencing the tokens."
08"Turn our brand colors into tokens that work for email too — inline-safe values for Klaviyo templates — and document which token maps to button, background, and text."
09"Audit the onboarding hub for every raw hex code and font-family declaration, list where they are, and replace them with references to a central token file so the whole site re-themes in one place."
10"Set up accessible color-pair tokens — pre-approved text-on-background combinations that pass WCAG AA — so anyone building a page just picks a safe pair instead of guessing contrast."
11"Create a token set for a seasonal ‘holiday’ theme variant of our brand — a deeper, warmer palette — that we can swap on for December and swap off in January with one change."
12"Build component-level tokens for buttons (primary, secondary, ghost) tied to our brand colors, including hover and disabled states, and show how the landing page would consume them."
13"Document our existing tokens as a plain-English reference page for the team — what each color, font, and spacing token is for and when to use it — so non-coders pick the right one."
14"Generate the design tokens in multiple formats — CSS variables, a JSON file, and Tailwind config values — so the same MM brand values work across the hub and any future build."
15"Create elevation/shadow and border tokens that feel premium and restrained for our ‘everyday luxury’ look, and show me a product card using them instead of ad-hoc shadows."
16"Set up a token naming convention and starter file for our wholesale portal so its pages stay consistent with the main brand while allowing a slightly more buttoned-up B2B variant."
17"Take our brand fonts and build a responsive type-scale token system that steps down sizes on mobile, and demonstrate it on a hero headline and body paragraph."
18"Review our current token file for gaps — missing states, undocumented values, any color that fails contrast — and give me a cleaned-up, fully documented version."
19"Build a single source-of-truth token file the onboarding hub, our landing pages, and our email templates all import, and explain how to update the hot-pink accent everywhere in one edit."
20"Create state tokens for interactive elements — hover, focus, active, disabled, and error — tied to our brand palette, and show a form input and a link consuming them so behavior stays consistent."
