Skip to main content
← All Patterns

Pattern

Principled Defaults

Every configuration value traces to a principle. No arbitrary numbers. 20px padding—why 20? If you can't answer, it's decoration.

"Indifference towards people and the reality in which they live is actually the one and only cardinal sin in design."

— Dieter Rams

Definition

Principled Defaults means every value in a system can be traced to a reason. Not "20px because it looks good" but "20px because it's the base unit (16px) multiplied by 1.25 (minor third)."

This isn't pedantry—it's design honesty. Arbitrary values are hidden opinions. Principled values are explicit decisions. When you can explain why, you can also explain when to deviate and when not to.

The CREATE SOMETHING design system derives all values from principles: typography from readability research, spacing from mathematical ratios, colors from functional meaning. Nothing is arbitrary. Everything traces.

"If you can't explain the principle behind the value, the value is arbitrary."

Principles

Typography from Research

Line height, measure (line length), and font size derive from readability studies. Optimal reading: 16-20px body, 45-75 characters per line, 1.5-1.6 line height.

✓ Body: 18px (within 16-20px optimal)

✓ Measure: 65ch (within 45-75ch optimal)

✓ Line height: 1.6 (within 1.5-1.6 optimal)

Spacing from Ratios

Use mathematical ratios: golden ratio (1.618), modular scales, or consistent base units. Spacing values should relate to each other.

✓ Base unit: 16px

✓ Scale: × 0.618, × 1, × 1.618, × 2.618

✓ All spacing derived from scale (10px, 16px, 26px, 42px)

Colors from Function

Colors should have meaning, not just aesthetics. Error is red not because red is pretty but because red signals danger. Green means success.

✓ Primary: white (pure information)

✓ Secondary: white/80 (supporting content)

✓ Muted: white/40 (de-emphasized)

Trace Every Value

Document the principle behind each value. If a value can't be traced, question whether it should exist.

✓ Design tokens with documented rationale

✓ Comments explaining "why" not "what"

✓ Review process that questions arbitrary values

When to Apply

Apply When

  • • Creating design systems
  • • Establishing configuration defaults
  • • Values will be reused across projects
  • • Multiple people will make design decisions
  • • Consistency matters long-term

Balance With

  • • Practical constraints (sometimes 20px just works)
  • • Exploration phase (find principles through iteration)
  • • Context-specific overrides
  • • Pragmatism over dogmatism

Derivation Example

Spacing Scale Derivation

--space-xs 10px
16 × 0.618 ≈ 10
--space-sm 16px
Base unit (1rem)
--space-md 26px
16 × 1.618 ≈ 26
--space-lg 42px
16 × 2.618 ≈ 42
--space-xl 68px
16 × 4.236 ≈ 68
TokenValueDerivation
--space-xs10px16 × 0.618 ≈ 10
--space-sm16pxBase unit (1rem)
--space-md26px16 × 1.618 ≈ 26
--space-lg42px16 × 2.618 ≈ 42
--space-xl68px16 × 4.236 ≈ 68

Every spacing value derives from base unit (16px) × golden ratio powers. No arbitrary values. Complete traceability.