OpenCode Terminal Mono
Design an OpenCode-inspired terminal-native landing page. Ideal for agentes de código ai, clis, ferramentas open-source, editores de terminal. AI-ready template.
Use case: Agentes de código AI, CLIs, Ferramentas open-source, Editores de terminal
Historical Context
The terminal never left. It just waited for designers to stop pretending GUIs solved everything. OpenCode Terminal Mono exists in the lineage of systems that refused decoration — from the raw phosphor glow of VT100 screens to the deliberate austerity of Plan 9's acme editor. Berkeley Mono gave monospace type a backbone again after decades of neutered programmer fonts optimized for "readability" at the expense of character. This system takes that foundation and strips it further. Brutalism in interface design isn't an aesthetic choice — it's a political one. It says: the tool is the interface. No chrome, no padding theater, no hover states that exist to reassure product managers. OpenCode inherits from the same impulse that made Unix pipes composable and man pages sufficient. The CLI-first movement of the 2020s — tools like lazygit, helix, zellij — proved that developers don't need to be coddled. They need density, predictability, and respect for their attention. This system codifies that conviction into a repeatable language. Every decision serves the person typing, not the person watching over their shoulder.
When to Use
When your users live in the terminal and resent being pulled out of it. CLI tools that need documentation sites without betraying their own philosophy. Open-source projects where the README energy should carry through to the marketing page. Developer utilities that would feel dishonest wrapped in gradients and illustrations. Any context where typographic density signals competence rather than intimidation — where your audience reads man pages voluntarily.
Design Principles
- Monospace is not a constraint — it's a grid system. Every character cell is a layout unit. Embrace the rigidity instead of fighting it.
- No element exists without function. If it doesn't communicate state, hierarchy, or action, it's decoration and it goes.
- Contrast is binary. Foreground/background. Active/inactive. Present/absent. Reject the middle ground of subtle grays and 0.6 opacity placeholders.
- The terminal cursor is your only animation. Movement implies state change. Anything else is theater.
- Density is generosity. Showing more information in less space respects the user's time and intelligence. Whitespace is earned, not defaulted.
Technical Specs
Colors
Primary
Secondary
Effects
Berkeley Mono como ÚNICA fonte — monospace em tudo, sem sans-serif ou serif. Escuro quente (#201d1d) com subtom avermelhado-marrom, não preto puro. Texto off-white quente (#fdfcfc). Radius mínimo 4px — cantos utilitários afiados. Cores semânticas Apple HIG (azul #007aff, vermelho #ff3b30, verde #30d158, laranja #ff9f0a). Bordas transparentes quentes (rgba(15,0,0,0.12)). Links com underline como estilo padrão. Único variante de botão: fundo escuro, texto claro, padding tight (4px 20px). Terminal hero como elemento visual principal.
Light/Dark
✗ Not Recommended / ✓ Full
Related
Last synced: 4/1/2026