Design System Architecture
Design System Architecture
Create consistent, scalable visual languages that evolve gracefully
This skill provides frameworks for building design systems that scale from single projects to entire organizations.
Core Principles
1. Tokens Are Truth
Design decisions should be encoded as tokens (variables). Nothing should be hard-coded.
2. Constraints Enable Creativity
A good design system provides guardrails that speed up decisions, not slow them down.
3. Components Over Compositions
Build primitives that compose into anything, not specific layouts that restrict.
Token Architecture
More from frankxai/arcanea
arcanea-architect
Expert guidance for building the Arcanea creative agent ecosystem with attention to detail, design excellence, and systematic implementation.
34agent-implementer
Implementation guidance for creating individual agents in the Arcanea system with proper structure, capabilities, and integration.
33arcanea-coding-agent
Arcanea creative agent integration for opencode
29opus-extended-thinking
Leverage Claude Opus 4.5's extended thinking capabilities for deep reasoning, complex analysis, and multi-step synthesis. Use when problems require thorough deliberation before response.
9hooks automation
Automated coordination, formatting, and learning from Claude Code operations using intelligent hooks with MCP integration. Includes pre/post task hooks, session management, Git integration, memory coordination, and neural pattern training for enhanced development workflows.
8web-artifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
8