nexu-io/open-design
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`.
npx skills add https://github.com/nexu-io/open-design --skill "design-templates/web-prototype-taste-soft"Source checked Jul 28, 2026·Refresh due Oct 26, 2026
Reorganized from the pinned upstream SKILL.md
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.
npx skills add https://github.com/nexu-io/open-design --skill "design-templates/web-prototype-taste-soft"The pinned source contains enough sections and task detail for a source-grounded deep guide; automated content is still not an independent test.
515 source words · 6 usable sections
Design process
Sections are extracted automatically from the pinned SKILL.md and link back to the source.
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.
Canvas: silver-grey or warm cream (F2F2F0 or FDFBF7). Not pure white.
Inter, Roboto, Helvetica, Open Sans.
Floating-pill navbar with backdrop-blur-2xl.
All transitions: transition: transform 700ms cubic-bezier(0.32,0.72,0,1) minimum.
SkillSignal prompt templates
These prompts were written by SkillSignal from the source structure; they are not upstream text.
Source-grounded prompt
Use for a design task while explicitly checking the source sections.
Use web-prototype-taste-soft for this design task: [task]. Inputs and constraints: [details]. Work through these pinned SKILL.md sections: “Source”, “Hard rules”, “Banned”, “Required components”, “Motion”. Cite the concrete requirements that shape each step, do not invent capabilities absent from the source, and verify the result against: [acceptance criteria].
Design checklist
The source section “Source” has been checked.
The source section “Hard rules” has been checked.
The source section “Banned” has been checked.
The source section “Required components” has been checked.
FAQ
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.
The source record exposes this install command: npx skills add https://github.com/nexu-io/open-design --skill "design-templates/web-prototype-taste-soft". Inspect the command and pinned source before running it.
Quality breakdown
Based on traceable docs and repository signals; stars are not treated as quality.
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-out