Oryzo
A dark, cinematic product-launch interface built on a near-black canvas warmed by a deep-brown gradient, with cream (#ffedd7) display type and a single hot-orange (#dc5000) primary CTA. The system reads as a moody, high-contrast hardware/AI teaser — oversized Halyard Display headlines set tight (line-height 0.9), pill-shaped orange buttons, an olive-and-tan earthy accent palette, and orange glow shadows used as the only source of light in an otherwise unlit layout.
Works with
Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
Color Palette
Accent
Neutrals
Typography
display-xl
123px · 500 · 0.9
The quick brown fox jumps
display-lg
51px · 500 · 1.0
The quick brown fox jumps
display-md
33.75px · 500 · 1.0
The quick brown fox jumps
title
24px · 500 · 1.09
The quick brown fox jumps
button
12px · 500 · 1.1
The quick brown fox jumps
Spacing & Shape
Spacing
| Name | Value | Preview |
|---|---|---|
| xxs | 6px | |
| xs | 9px | |
| sm | 12px | |
| md | 14px | |
| lg | 18px | |
| xl | 24px | |
| xxl | 30px |
Border Radius
| Name | Value | Preview |
|---|---|---|
| sm | 12px | |
| md | 22px | |
| lg | 36px |
FAQ
- What colors does Oryzo use?
- Oryzo's core palette includes #dc5000, #e07010, #100904, #ffedd7, #ffedd6. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Oryzo DESIGN.md.
- What font does Oryzo use?
- Oryzo's primary typeface is halyard-display-variable. The complete type scale (sizes, weights, line-height and letter-spacing per role), with an open substitute where the original is licensed, is documented in the DESIGN.md.
- What is the Oryzo design system?
- A dark, cinematic product-launch interface built on a near-black canvas warmed by a deep-brown gradient, with cream (#ffedd7) display type and a single hot-orange (#dc5000) primary CTA. The system re…