Typeui Fundamentals

A comprehensive foundation layer that sits between your design system tokens and the actual UI you ship. It covers the why behind visual hierarchy, spacing rhythm, the 30 core UX laws, typography fundamentals, and WCAG compliance rules. Load it after your design system to understand principle reasoning when tokens alone don't answer your question. The conflict resolution is clear: design system wins for concrete values, fundamentals win for structural principles, accessibility overrides everything. Most useful when you're making decisions in gaps the design system doesn't cover or when you need to justify why a certain approach follows established interaction patterns. From typeui.sh, MIT licensed.

skills.sh installs: 2.3K
GitHub stars: 2.2K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add bergside/typeui --skill typeui-fundamentals --agent claude-code

Installs into .claude/skills of the current project.

Files

Design Fundamentals — Agent Instructions

Universal design principles that define why patterns work, how to apply them correctly, and what accessibility requirements are non-negotiable. These are timeless, design-system-agnostic foundations that apply to every surface regardless of vertical or workflow phase.

Load order

Read these files after loading the design system (SKILL.md / DESIGN.md + token modules). The design system tells you what token to use; these files explain why that decision is correct and how to avoid common principle violations.