DESIGN.md@.agents/tools/design/library/styles/corporate-modern git:20260404.eaab15bA

Immutable. This exact content is served forever at /api/v1/blob/28aa4ed2b9b47ecc.

# Design System: Corporate Modern

Contemporary enterprise aesthetic — confident, clean, forward-looking. Targets modern SaaS platforms, fintech, and tech-forward professional services. Competence through clarity, not ornamentation.

## Chapters

| File | Contents |
|------|----------|
| [01-theme.md](01-theme.md) | Visual theme, atmosphere, key characteristics |
| [02-colours.md](02-colours.md) | Colour palette — primary, neutral, surface, semantic |
| [03-typography.md](03-typography.md) | Font families, type scale, typography principles |
| [04-components.md](04-components.md) | Buttons, inputs, links, cards, navigation |
| [05-layout.md](05-layout.md) | Spacing scale, grid, container widths, border radius |
| [06-elevation.md](06-elevation.md) | Depth levels, shadow values, elevation principles |
| [07-dos-and-donts.md](07-dos-and-donts.md) | Rules — what to do and what to avoid |
| [08-responsive.md](08-responsive.md) | Breakpoints, touch targets, mobile-specific rules |
| [09-agent-prompts.md](09-agent-prompts.md) | CSS variable reference, ready-to-use AI prompts |

## Quick Reference

**Accent:** `#0891b2` (teal) — CTAs, active states, links
**Background:** `#FFFFFF` page / `#F8FAFC` surfaces
**Text:** `#1a1a2e` headings / `#334155` body / `#64748b` secondary
**Border:** `1px #E2E8F0` default / `#CBD5E1` hover
**Font:** Inter / system-ui (all roles) — `"JetBrains Mono"` for code
**Grid:** 8px base, 12-column, 1280px max container
**Radius:** 8px buttons/inputs / 12px cards / 16px modals
**Motion:** 150ms ease-out, colour and shadow only

<!--
Style archetype by AI DevOps (https://aidevops.sh)
DESIGN.md format: https://stitch.withgoogle.com/docs/design-md/overview
Not based on any specific brand. Use as a starting point for your project.
-->