Apple-tier soft web prototype. Silver/cream canvas, double-bezel cards, button-in-button CTAs, generous squircle radii, spring motion, ambient mesh. Distilled from Leonxlnx/taste-skill `soft-skill` + sections 4–8 of `taste-skill`.
For briefs that ask for "Apple-like", "Linear-tier", "premium consumer", "calm SaaS", or "$150k agency" finish. The aesthetic is soft, weighty, and obsessive about nested architecture.
Distilled from Leonxlnx/taste-skill — skills/soft-skill/SKILL.md ("Vanguard UI Architect") with the haptic micro-aesthetics, double-bezel architecture, and motion choreography rules. See example.html in this directory for a fully-realized template.
#F2F2F0 or #FDFBF7). Not pure white.clamp(48px, 7vw, 96px), letter-spacing: -0.035em, line-height: 0.96. Heavy weight (700+).border-radius: 28px–40px (rounded-[2rem] to rounded-[2.5rem]) on major surfaces.p-1.5, hairline border, soft outer shadow) containing an inner core with its own background and a concentric smaller radius (e.g., outer 2rem, inner calc(2rem - 0.375rem)).rounded-full px-6 py-3); the trailing arrow lives inside its own circular wrapper flush-right.opacity ≤ 0.18, pointer-events: none, fixed.letter-spacing: 0.2em, text-[10px].border-black/5 / ring-1 ring-black/5).shadow-md, shadow-lg, hard drop shadows. Only diffuse, wide-spread, low-opacity (0 20px 40px -15px rgba(0,0,0,0.05)).mt-6 mx-auto w-max rounded-full).ease-in-out transitions. Use cubic-bezier(0.32, 0.72, 0, 1) or spring physics.h-screen (use min-h-[100dvh]).width / height / top / left. Only transform and opacity.#000. Use Zinc-950 / Off-Black.max-w-[52ch], two CTAs (primary pill with button-in-button arrow + ghost).-100% / 20s), pause on hover.transition: transform 700ms cubic-bezier(0.32,0.72,0,1) minimum.0.98 on :active, inner trailing-icon circle translates (+1px, -1px) and scale(1.05).translateY(16px) blur(8px) opacity(0) → translateY(0) blur(0) opacity(1). IntersectionObserver only.transform: translateX(-50%) over 30s linear infinite, applied to a duplicated track.backdrop-blur + hairline ringpy-24min-h-[100dvh], never 100vhlinear / ease-in-outCopy a source-pinned command for your client. You run it yourself.
Destination: .claude/skills/web-prototype-taste-soft · pinned to the source commit
# Run from your project root
git clone https://github.com/nexu-io/open-design.git .skillboard-tmp
git -C .skillboard-tmp checkout 9881cff70e02be86c2a58130af512011ba23d4af
mkdir -p ".claude/skills"
cp -r ".skillboard-tmp/design-templates/web-prototype-taste-soft" ".claude/skills/"
rm -rf .skillboard-tmpReview the source before running. This copies files into your project; it is not a one-click install and does not verify runtime safety.
sudo apt update && sudo apt install -y gitnpm install -g @anthropic-ai/claude-code# Run from your project root
git clone https://github.com/nexu-io/open-design.git .skillboard-tmp
git -C .skillboard-tmp checkout 9881cff70e02be86c2a58130af512011ba23d4af
mkdir -p ".claude/skills"
cp -r ".skillboard-tmp/design-templates/web-prototype-taste-soft" ".claude/skills/"
rm -rf .skillboard-tmpDestination: .claude/skills/web-prototype-taste-soft
Scanner static-checks@0.1.0 · commit 9881cff70e02. Static checks cannot prove runtime safety – review the source and the exact diff before installing. How checks work.
No static rules matched. This is not a safety guarantee.