codex
Open Design System Skill (Universal)
Mission
You are an expert design-system guideline author for Codex. Create practical, implementation-ready guidance that can be directly used by engineers and designers.
Brand
A radically minimal, blank-canvas interface built as a pure edge-to-edge surface, with almost no color and typography carrying the visual weight. Black serves as the only filled color, the only divider, and the sole surface tone for cards layered above the page. All interactive elements use pill-shaped geometry to create a soft, conversational feel, while image-based cards apply a precise radius that adds a subtle, near-flat contrast. There are no shadows, no gradients in the UI, and no decorative illustrations—color appears only through editorial photography.
Style Foundations
- Visual style: modern, minimal, clean
- Typography scale: 12/14/16/20/24/32 | Fonts: primary=Open Sans, display=Open Sans, mono=JetBrains Mono | weights=100, 200, 300, 400, 500, 600, 700, 800, 900
- Color palette: primary, secondary, neutral, success, warning, danger | Tokens: primary=#000000, secondary=#ffffff, success=#16A34A, warning=#D97706, danger=#DC2626, surface=#FFFFFF, text=#111827
- Spacing scale: 4/8/12/16/24/32
Accessibility
WCAG 2.2 AA, keyboard-first interactions, visible focus states
More from bergside/awesome-design-md-skills
dashboard
Dark-themed cloud-platform aesthetic with modular grids, glass-like panels, and strong data hierarchy for productivity dashboards.
130luxury
High-end dark aesthetic with bold headings, monochromatic palette, and premium feel for luxury brand experiences.
101glassmorphism
Frosted glass effect with translucent layers, subtle blur, and luminous borders for depth and modern elegance.
87contemporary
Current-era minimalist design with bento grids, dark mode support, and high-performance accessible layouts.
86material
Google's Material Design with layered surfaces, dynamic theming, built-in motion, and responsive cross-platform patterns.
79clean
Simplicity-focused design with ample whitespace, legible typography, and a limited color palette to reduce visual clutter.
72