# Expo Design System ## Visual Theme & Atmosphere Developer-focused precision. Dark IDE-like interface (#0B0B0F) reduces eye strain during long coding sessions. Purple accents (#4630EB) signify cross-platform power. The design mirrors VS Code—familiar, efficient, code-centric. ## Color Palette & Roles | Token | Hex | Role | |-------|-----|------| | Primary | #4630EB | Brand purple, CTAs | | Background | #0B0B0F | Deep dark canvas | | Surface | #151519 | Panels, cards | | Text | #FFFFFF | White text | | Muted | #8F8F8F | Secondary text | | Border | #2A2A2E | Dark borders | ## Typography Rules - **Heading Font**: Inter, system-ui, sans-serif - **Body Font**: Inter, system-ui, sans-serif - **Base Size**: 15px - **Line Height**: 1.5 ## Component Stylings - **Buttons**: Purple bg, sharp corners - **Code Blocks**: Dark surface, syntax highlighting - **Terminal UI**: Command-line style interactions ## Agent Prompt Guide Use dark IDE-like theme, purple accents, code-first layouts, tight letter-spacing for compact UI.
React Native跨平台开发工具。深色主题,紧凑字距,代码优先设计。
Expo 的主色调是 #4630EB,背景色为 #0B0B0F,文本色为 #FFFFFF。
标题字体: Inter, system-ui, sans-serif。正文字体: Inter, system-ui, sans-serif。基础字号: 15px。
点击上方 DESIGN.md 代码块中的复制按钮,将完整设计规范复制到你的项目中。AI Coding 工具(如 Cursor)可以直接读取 DESIGN.md 来生成符合 Expo 风格的代码。