ORBYGEntrar

ORBYG / DESIGN SYSTEM

Uma linguagem.
Todas as órbitas.

A base visual e funcional do nosso universo. Componentes reais, regras compartilhadas e espaço para evoluir com consistência.

Biblioteca viva · 1.2Zalando Sans Expanded / Dark / Signal greenConsultar implementação
01

Fundamentos

Escuro por essência. Verde para orientar. Espaço para respirar.

HOSPEDAGEM PARA QUEM VIVE O JOGO

Seu mundo
Suas regras
Nossa estrutura

Da primeira construção à próxima grande comunidade. Encontre a hospedagem para jogar DayZ com a sua comunidade.

Encontrar meu servidor Conheça a estrutura
Ryzen™ 9 9950X Memória DDR5
UM NOVO MUNDO COMEÇA AQUI01 / 01
CADA ESCOLHA CONTADayZ
A partir de R$ 161,98/mês
Capacidade por Órbita
ESCOLHA. CONFIGURE. REÚNA SUA COMUNIDADE.Explore os universos
01 / PROFUNDIDADE

Vidro com propósito.

Superfícies translúcidas sobre imagem. Fundos sólidos para configuração e leitura prolongada.

02 / COMPOSIÇÃO

Precisão editorial.

Assimetria, linhas finas e pequenos marcadores técnicos organizam o espaço.

03 / GEOMETRIA

Uma órbita mais fluida.

Controles arredondados, ações em cápsulas e painéis amplos com curvas contínuas.

Selecione uma cor para copiar o token CSS.

Tipografia / Zalando Sans Expanded

Uma família variável, pesos 200–900 e itálico real. Corpo a partir de 16 px.

Seu jogo.
Sua órbita.

O próximo mundo começa aqui.

Texto de leitura com contraste, ritmo e uma largura confortável.

RÓTULOS / 12 PX / TRACKING

Escala e geometria

Base de 4 px. Raios de 12, 24 e 36 px. Controles de 48 px.

4
8
12
16
24
32
48
64
12 px24 px

Objetos em órbita.

Recortes PNG com alpha. Flutuação de 6,5–10 s e entradas de 450 ms.

Minecraft
DayZ
Project Zomboid
Rust

Movimento suspenso fora da tela e desativado pela preferência de movimento reduzido. A pausa vale para todo o site.

Som com forma de bolha.

Toques curtos, suaves e graves. Ative o som para experimentar. A preferência vale para todo o site; nenhuma música é reproduzida.

Ícones

Lucide, traço consistente. 16–24 px com rótulos acessíveis.

Movimento

180 ms para respostas; 250–350 ms para transições.

Passe o cursor ou dê foco

Sem rolagem interceptada. A preferência por movimento reduzido é respeitada.

02

Ações

Uma ação principal por contexto. O restante acompanha a hierarquia.

Hierarquia

Estados e dimensões

Foco visível por teclado. Alvo mínimo de 44 px.

Explorar jogos
03

Formulários

Controles com a identidade ORBYG, sem perder teclado, semântica ou previsibilidade.

Entrada e validação

Exemplo local. Nenhum dado é enviado.

Use pelo menos 3 caracteres.

Seleção e quantidade

Setas ↑↓ ajustam; Home/End alcançam os limites.

Opções ilustrativas, sem promessa de disponibilidade.

10 jogadores100 jogadores

Campo e slider compartilham o mesmo valor: 30.

Escolhas independentes

Prévia ativada · Detalhes visíveis

Escolha exclusiva

Uma única opção ativa em cada grupo.

05

Feedback

Mensagens objetivas. Cor, ícone e texto trabalhando juntos.

RascunhoDisponívelEm breveRevisarDemonstração
Configuração atualizada

As alterações foram aplicadas à sua simulação.

Valores demonstrativos

Nenhuma cobrança acontece nesta versão.

Ainda em preparação

Este jogo será disponibilizado em uma próxima etapa.

Revise a quantidade

Informe um valor dentro dos limites do jogo.

Seu próximo servidor começa por um jogo.

Estados vazios explicam o contexto e indicam o próximo passo.

Ver catálogo
06

Camadas e rolagem

Superfícies contidas, fechamento claro e foco devolvido à origem.

Diálogo e painel lateral

Escape fecha. Tab permanece dentro da camada aberta.

Barras de rolagem

Trilho escuro e indicador visível. Nunca ocultar conteúdo.

01Superfície consistenteDisponível
02Superfície consistenteDemonstração
03Superfície consistenteDisponível
04Superfície consistenteDemonstração
05Superfície consistenteDisponível
06Superfície consistenteDemonstração
07Superfície consistenteDisponível
08Superfície consistenteDemonstração
VoidSlateOrbitCoreSignalZalandoSpaceMotion
07

Componentes de produto

A biblioteca também documenta as peças que dão identidade à experiência.

Cartão de jogo

Imagem, título e acesso ao catálogo real.

02
CADA ESCOLHA CONTA

DayZ

A partir de R$ 161,98/mêsVer planos

Plano e configuração

O mesmo cartão usado nas páginas dos jogos.

Comunidade

Ponto de partida

Para reunir a próxima aventura.

R$ 99,90/mês
30 jogadores
Modalidade Essencial
Resumo interativo

DayZ / 30 jogadores

Essencial · Capacidade pretendida

R$ 99,90/mêsValor demonstrativo
08

Uma fonte de verdade

Novas telas devem compor esta biblioteca e consumir os mesmos tokens.

Estrutura

styles/tokens.css
Cores, escalas, raios e movimento.
styles/components.css
Aparência e estados dos controles.
components/design-system
Componentes compartilhados e esta biblioteca.
components/orbyg
Peças de produto: jogos, planos e configuração.

Como usar

import { Button, NumberField }
  from '@/components/design-system';

<Button variant="primary">
  Continuar
</Button>

/* Use papéis, não valores avulsos. */
color: var(--foreground);
border-radius: var(--radius-sm);
Critérios para novos componentes

Reutilizar antes de criar. Documentar estados, teclado e responsividade. Todo novo padrão deve aparecer aqui e ser usado pela interface real.