Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →bergside/typeui-fundamentals
Universal UI/UX design principles covering visual hierarchy, interaction laws, typography foundations, and WCAG accessibility requirements.
Passed 22 of 25 test cases with the skill, and 10 of 25 without it.
and 11 more in the full report
13 fixed9 passed either way2 still failing1 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 13 test cases the skill fixed. Same model, same prompt, with and without the skill.
Which design fundamental module defines rules for proximity grouping, vertical and horizontal rhythm, and heading-to-paragraph spacing tiers?
| Checked | Without skill | With skill |
|---|---|---|
| The response identifies spacing-principles.md as the file governing proximity grouping and spacing tiers. | Missed | Passed |
The instructions your model reads when the skill loads.
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.
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.
| File | Purpose |
|---|---|
| ui-principles.md | Universal visual design principles — hierarchy, layout rhythm, typography placement, color theory, depth & layering, interaction design, responsive adaptation, component behavior |
| spacing-principles.md | Spacing-specific principles — 4-point grid, proximity grouping, inner vs outer gaps, vertical and horizontal rhythm, heading→paragraph spacing, section and component spacing tiers |
| ux-principles.md | Interaction & control principles — 30 UX laws, button/control state contracts (9 states), hover/active technique palettes, touch targets, cognitive load, feedback loops |
| typography-principles.md | Typography-specific principles — type system foundations, scale & modular ratios, readability & measure, accessibility, responsive type, brand tone expression through type |
| accessibility.md | WCAG 2.1/2.2 compliance — contrast ratios, color-as-information rules, focus visibility, keyboard navigation, motion safety, target sizes, text spacing, semantic structure, ARIA |
These files do not define:
skills/vertical/SKILL.mdskills/vertical/inspect.md, review.md, preflight.mdskills/vertical/anti-patterns.mdskills/vertical/team-social-saas.mdskills/design-system/SKILL.mdWhen sources disagree:
Accessibility is non-negotiable at every level — it overrides aesthetic preferences everywhere.
Any design decision not covered by the system's tokens or component rules falls back to the principles here. Never contradict the design system — if a principle and a design-system rule conflict, the design system wins. Flag the conflict for review.
test cases passed, vs 10 / 25 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.