Claude Skills · Design

Factory Design

nonlinear-xyz/factory-kit

Design-system discipline distilled across builds. Semantic token vocabulary (name intent, not palette position), CSS variables bridged into Tailwind, dark/light as a variable swap, single- vs two-layer token systems, component primitives as token consumers, when to promote a repeated utility cluster into a primitive, and the vocabulary-sprawl failure mode. Read whenever you touch styling — marketing surface, internal app, or design-system repo. Paired with factory-frontend, which delegates here for visual coherence.

★ 9 Synced 11 hours ago View SKILL.md

At a glance

Design Plugin install Node.js Actively maintained

This skill is for Design and helps you design a semantic token system, build a component primitive library, and set up css variables for tailwind.

Install /plugin marketplace add nonlinear-xyz/factory-kit /plugin install factory-design
Can use Not declared by the author

Setup, runtime and requirements describe nonlinear-xyz/factory-kit, the repo this skill ships in.

design-systemsSemantic TokensCss VariablesTailwinddark-modeComponent Primitives

Also in nonlinear-xyz/factory-kit

View the repo

Motion discipline distilled across builds. Attention as a fixed per-viewport budget, figure/ground separation (calm the ground, load motion...

Factory API Legal

API conventions for both server actions and tRPC builds. Covers the decision between them, per-mutation Zod input schemas, central router co...

Use when designing or implementing API endpoints — server actions, tRPC procedures, REST routes for external consumers. Carries the factory'...

Factory Auth DevOps & Infrastructure

Auth and authorization conventions distilled across builds with three different auth stacks (Better Auth + orgs, Supabase Auth + RLS, Clerk)...

Factory Auth Wiring Specialist DevOps & Infrastructure

Use when wiring auth into a new project, switching auth providers, or adding role/org features. Carries the factory's auth conventions — the...

Factory CI DevOps & Infrastructure

CI and pull-request review conventions. One canonical `.github/workflows/ci.yml` is the merge gate (typecheck, lint, test, build, claude-rev...

Factory Close DevOps & Infrastructure

Close out a Linear issue — move to Done, add a closing comment, and clean up the local branch/worktree

Use to review a PR, diff, or recently-written code against the factory's conventions. Read-only — outputs structured review, not diffs. Carr...

Factory Commits DevOps & Infrastructure

Commit message and branch convention — Conventional Commits format with a Linear issue reference required in subject or body. Includes the c...

Factory Data Layer Data & Analytics

Database schema, ORM, and migration conventions across builds. Drizzle as default with domain-partitioned schema modules, shared `timestamps...

Factory Data Pipeline Engineer DevOps & Infrastructure

Use when designing or implementing data ingestion, CSV imports, time-series storage, Python services that sit alongside Next.js, simulation...

Factory Data Pipelines DevOps & Infrastructure

Data ingestion and pipeline conventions for projects that import CSVs, run simulations, or operate Python services alongside Next.js. Covers...

Other Design skills

Frontend Design anthropics/skills

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typog...

Algorithmic Art anthropics/skills

Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art...

Prototype mattpocock/skills

Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right,...

Design An Interface mattpocock/skills

Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explor...

Chat Motion Overlay nexu-io/open-design

Generate configurable chat motion overlays from a transcript or screenshot, including plain bubble scenes, app-style chat containers, option...

Wireframe Annotated nexu-io/open-design

An annotated / redline lo-fi wireframe — a desktop landing/marketing page drawn as flat greyboxes inside a browser chrome frame, overlaid wi...