Ss Page
bitjaru/styleseedScaffold a new product page or screen from the compiled StyleSeed output grammar, surface adapter, brand recipe, and project lock.
At a glance
This skill is for Coding and helps you scaffold a product page from styleseed, generate a screen from brand guidelines, and create a new page from design tokens.
git clone --depth 1 https://github.com/bitjaru/styleseed
cp -r styleseed/skills/ss-page ~/.claude/skills/ss-page
Setup, runtime and requirements describe bitjaru/styleseed, the repo this skill ships in.
Styleseeddesign-systemsComponent ScaffoldBrand ConsistencyProduct Pagesdesign-tokens
Also in bitjaru/styleseed
View the repoAudit a component or page for accessibility issues and fix them
Audit screens for UX issues using Nielsen's heuristics and modern mobile UX best practices
Build a screen with StyleSeed's composed design method — choose or compile an output grammar, apply a brand recipe plus domain/page/profile/...
Generate a new UI component following the StyleSeed design conventions
Generate UX microcopy (button labels, error messages, empty states, toasts) following a casual-but-polite voice and tone
Turn ONE design axis up or down as a coordinated, deterministic transform — "denser", "sharper corners", "more muted", "bolder", "flatter",...
Add appropriate user feedback states (loading, success, error, empty) to a component or page
Design user flows and navigation structure following proven UX patterns
Quick automated lint — detects common design system violations in seconds
Apply a named StyleSeed motion to a component — either one of the 5 personality seeds (Spring/Silk/Snap/Float/Pulse × entrance/exit/hover/pr...
Generate a composed UI pattern from the active StyleSeed grammar and brand recipe using existing primitives.
Compile screenshots, URLs, Figma exports, or an existing UI into a project-local StyleSeed output grammar with evidence, tokens, confidence,...
Other Coding skills
Behavioral guidelines to reduce common LLM coding mistakes. Use when writing, reviewing, or refactoring code to avoid overcomplication, make...
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI be...
Guide for creating high-quality MCP (Model Context Protocol) servers that enable LLMs to interact with external services through well-design...
Reference for the Claude API / Anthropic SDK — model ids, pricing, params, streaming, tool use, MCP, agents, caching, token counting, model...
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS,...
Create a detailed refactor plan with tiny commits via user interview, then file it as a GitHub issue. Use when user wants to plan a refactor...