UI Design Principles — Everyday Knowledge Base

What problem does it solve?

It prevents UI work from drifting into inconsistent, low-quality choices by giving a single, actionable reference for color, typography, layout, alignment, motion, and UX decision rules.

Core Features & Use Cases

• Color systems guidance: Apply rules for deriving darker/lighter variants, hue shifts, and accessible contrast planning instead of ad-hoc hex tweaking.
• Typography foundations: Enforce readable type hierarchy (size/weight/spacing), limit typeface chaos, and use line-height and baseline scales correctly.
• UI/UX execution rules: Follow principles for spacing/white space, alignment cleanliness, animation timing and reduced-motion, and interaction patterns like locality and dropdown avoidance.
• Use case: When redesigning a screen, quickly standardize button states, surface neutrals, headline/body hierarchy, spacing rhythm, and motion behavior using the same set of principles across components.

Quick Start

Ask your AI to apply the UI Design Principles knowledge base to your proposed UI and return a revised set of colors, typography hierarchy, spacing rules, and motion guidelines that follow the principles precisely.