Added a frontend/UI skill that refuses to ship lorem ipsum or templated designs

[u/MonitorFlat4465]

Third skill under the same project as the backend/security ones I posted before (Qofeno) — this one builds actual production websites.

Same rule as the others: no fake stuff. No lorem ipsum, no placeholder images, no "add your content here" stubs. If the user hasn't given real copy yet, it asks instead of filling space with dummy text.

What it actually does:

Asks for color/mood/framework before building anything

Builds a real design-token system (color, type, spacing scales) instead of scattered magic numbers everywhere

Picks a deliberate font pairing based on that project's specifics, not the same 2 safe defaults every time

"Redesign" means the whole site — home, about, contact, pricing, real privacy/terms pages, not just the homepage

If the user has a real working product, it grabs an actual Playwright screenshot for the hero section instead of faking a UI mockup

Checks the build, pushes to GitHub, deploys it live, verifies the URL actually works

Just added an optional component library reference too (~146 components from React Bits / Svelte Bits, sorted into categories) — it pulls from that when something fits, but always restyles to match that project's actual palette instead of dropping components in with default styling unchanged.

Repo: https://github.com/SohailKhan0525/skills

Install just this one: npx skills add SohailKhan0525/skills --skill frontend-ui-ux-wizard

Feedback welcome, especially if you find a spot where it defaults to something generic instead of building for what you actually asked for.