An unofficial, original Raycast-inspired product system with 10 evidence-backed elements for Orbit's focused workflow language.
Foundations
A public overview of the typography, palette, icon language, spacing, shape, and motion used throughout this AI Kit.
Style identity
An original launcher system based on Raycast's observed promise of fast, ergonomic, reliable access: dark native-feeling surfaces, a bright focus accent, mono shortcut labels, and command-first content hierarchy.
dark-first with an adaptive light companion themeTypography
Inter
Observed Raycast marketing family for the hero, extension story, navigation, and body copy.
Inter, Inter Fallback, ui-sans-serif, system-ui, sans-serifFallback: Inter Fallback, ui-sans-serif, system-ui, sans-serif
GeistMono
Observed button labels, keyboard rows, command metadata, and technical UI accents.
GeistMono, JetBrains Mono, SFMono-Regular, monospaceFallback: JetBrains Mono, SFMono-Regular, monospace
Instrument Serif
Observed rare editorial accent for expressive statements; never the default UI face.
Instrument Serif, Georgia, serifFallback: Georgia, serif
VT323
Observed retro terminal accent in isolated campaign moments.
VT323, ui-monospace, monospaceFallback: ui-monospace, monospace
Palette
Launcher black
#07080aObserved Raycast page canvas
Launcher surface
#111216Primary command and extension surface
Raised result
#24262bHover, selected, and active command row
White signal
#ffffffPrimary content and high-contrast action
Muted shortcut
#9c9c9dSecondary copy and keyboard hint
Orbit violet
#a57cffFocus, selected result, and AI emphasis
Automation cyan
#5bd6ffExtension and connected workflow accent
Success
#39d98aInstalled or healthy extension state
Type scale
| Role | Size | Weight | Line height | Tracking |
|---|---|---|---|---|
| Launcher hero | 64px | 600 | 1.1 | 0 |
| Hero mobile | 42px | 600 | 1.08 | -0.02em |
| Section heading | 32px | 600 | 1.15 | -0.02em |
| Product heading | 20px | 500 | 1.35 | 0.01em |
| Body | 16px | 400 | 1.55 | 0 |
| Command label | 14px | 500 | 1.4 | 0.01em |
| Shortcut metadata | 12px | 400 | 1.6 | 0.02em |
Spacing & shape
Iconography
Keep icons optically centered in a square tile, use currentColor for utility icons, and never let an icon replace a necessary command label. The pack uses original CSS symbols and text glyphs.
System metrics
Radius
Spacing
Motion
Elevation
Result surface
0 1px 0 rgba(255,255,255,.04)Default command and extension separation
Launcher
0 18px 50px rgba(0,0,0,.40)Floating launcher and menu surface
Focus glow
0 0 0 3px rgba(165,124,255,.34)Keyboard focus and selected command
Surfaces & shape
Launcher canvas
#07080aDark-first page background
Command panel
#111216Launcher, extension, and AI surfaces
Result row
#24262bSelected result and hover state
Light companion
#f6f6f7Explicit light theme background
Guidelines
Imagery
Use original CSS key rows, extension tiles, command lists, and abstract glow planes. Avoid real extension icons, customer portraits, and copied product screenshots.
Layout
Use a 1180px rail with dark full-bleed campaign surfaces. Keep the launcher column narrow and centered; collapse extension grids from four to two to one columns; let command lists remain vertically scannable on mobile.
Concept
Use the file tree to move between the full reference preview, implementation guidance, portable tokens, and framework-ready styles. Each surface stays focused, so you can understand the system before copying code.
Assigned collection
10 published components in collection order
Components
Production-ready specimens from this AI Kit's approved collection.
More like this
An unofficial, original Postman-inspired interface study with 14 focused specimens supported by the live product and content experience.
An unofficial, original v0-inspired Prompt Workshop system grounded in 17 retained, evidence-backed interface patterns.
13 focused, original elements for Borderless Ledger; categories are retained only when supported by the live reference. Published flags remain disabled.
A high-contrast studio language for a platform that moves between creative production, developer workflows, robotics, research, and enterprise. The system uses a dark stage, warm action color, and compact cross-platform wayfinding without copying Runway's wordmark, content, or media. Responsive previews and 8 evidence-backed interface elements.
An original, unofficial Observable-inspired system for reactive notebooks, executable explanations, and data visualization surfaces. It retains only 11 focused elements supported by Observable's live notebook and chart workflows.
A friendly builder language for moving from prompt to app: vivid purple/green accents, a prominent idea field, artifact type selection, parallel execution, built-in infrastructure, team plans, agent chat, and a clear publish handoff. It is an original study without Replit's logo, pixel font, testimonials, screenshots, or protected copy. Responsive previews and 14 evidence-backed interface elements.