Type, Space, Shape, and Depth

Typography

Use a distinctive, legible display face only when the work benefits from editorial character. Use a dependable interface sans for navigation, forms, labels, and long reading. Keep body measure between 55 and 65 characters when practical.

Create hierarchy with scale, weight, line height, and position before adding color.

Spacing

Build rhythm from a small shared scale. Use tight spacing inside a component, medium spacing between related elements, and generous spacing between chapters. Mobile page padding usually begins around 16 pixels. Desktop narrative layouts often use 24 to 40 pixels.

Shape

Soft geometry needs a hierarchy. Expressive surfaces may use 24 to 30 pixel radii, inner cards 16 to 22 pixels, and compact controls 10 to 16 pixels. Keep nested radii visibly related.

Borders and shadows

Use low-contrast one-pixel borders for structure. Add shadow only when it explains elevation, focus, or interaction. Dark themes should rely more on surface and border differences than shadow.

Icons

Use one maintained icon family per surface. Match each symbol to its meaning, keep stroke weights coherent, label icon-only controls, and never use emoji as interface icons.