O que é Astryx?
Astryx é o design system de React da Meta, usado dentro da empresa por oito anos e, pelas contas da Meta, em mais de 13,000 apps internos, agora publicado sob a licença MIT. Traz mais de 150 componentes acessíveis, sete temas, modo escuro, modelos de página e uma CLI. Os estilos são escritos com StyleX, mas distribuídos como CSS já compilado, então você importa sem plugin de build e sobrescreve com Tailwind, CSS modules ou CSS puro.
A parte de IA é a CLI. astryx search, component, docs e template mostram props de componentes, tokens e modelos como texto ou JSON tipado, com um modo --dense que reduz tokens; astryx manifest --json descreve cada comando para que um agente não precise raspar o texto de ajuda; astryx init escreve uma seção gerenciada do Astryx na documentação para agentes e pode instalar uma skill para cada agente de programação da máquina. O llms.txt do site de documentação orienta os agentes a usar a CLI em vez de rastrear páginas.
O repositório foi criado em janeiro de 2026, tem cerca de 24,850 estrelas e 1,941 forks e continua marcado como beta; a v0.7.14 saiu em 11 de novembro de 2026. O @astryxdesign/core teve cerca de 635,000 downloads no npm na semana até 10 de novembro.
Astryx vale a pena?
O Astryx é primeiro um design system e só depois um projeto de IA, e essa ordem é a sua força. Oito anos de uso interno na Meta fazem com que os mais de 150 componentes cubram páginas de tabela, assistentes de formulário e telas de detalhe que kits mais novos deixam para você, e o trabalho de acessibilidade vem junto. O que o torna relevante aqui é que a Meta desenhou a API, a documentação e a CLI juntas, para que um agente que monta uma página receba a mesma referência que uma pessoa.
Na prática, um agente pode rodar astryx component Button --json ou astryx search "date range" e receber respostas tipadas e versionadas do pacote instalado, em vez de adivinhar props a partir dos dados de treinamento. A opção --dense devolve texto compacto para poupar contexto, e o astryx doctor verifica se a sua documentação para agentes ainda tem a seção do Astryx depois de uma atualização. É um ciclo mais confiável do que mandar um agente para um site de documentação, e é justamente a parte que falta na maioria das bibliotecas rivais.
As contrapartidas são as de sempre no primeiro lançamento público de um sistema interno antigo. Exige React 19 ou mais recente. A versão é a 0.7.14, saem versões várias vezes por semana e 679 issues e pull requests abertos mostram o quanto ainda está mudando; há codemods de atualização porque as APIs mudam. Os gráficos só são publicados sob uma tag canary. O swizzle copia o código-fonte de um componente para o seu projeto quando você precisa de controle total, o que também significa que a manutenção passa a ser sua.
Quanto a dados, há pouco com que se preocupar: é uma biblioteca de front-end sem serviço por trás, e o único comportamento de rede da CLI descrito no README é avisar que existe uma versão mais nova. Para um time já acomodado no shadcn/ui, o comando upgrade pode atualizar componentes copiados, mas migrar um app maduro é trabalho de verdade; o caso mais forte é uma ferramenta interna nova em que agentes vão escrever boa parte da interface.
Onde ele se destaca
Um time de ferramentas internas de três pessoas que usa o Claude Code
Criar painéis administrativos com aparência consistente sem designer
Rode astryx init para que a documentação do agente aponte para a CLI e peça ao agente para gerar uma página de tabela a partir de um modelo. Gratuito; a economia de tempo vem de menos rodadas corrigindo props inventadas.
Uma líder de front-end em uma empresa de SaaS com 40 pessoas
Dar ao produto uma marca própria sem fazer fork de uma biblioteca de componentes
Escolha um dos sete temas e sobrescreva as propriedades personalizadas de CSS; as classes do Tailwind existentes continuam valendo. Reserve tempo para atualizações enquanto o projeto estiver em beta.
Um engenheiro de plataforma padronizando a interface de vários apps em React 19
Manter agentes e pessoas nas mesmas convenções de componentes em todos os repositórios
Instale a CLI globalmente e em cada projeto; cada repositório responde com a própria versão fixada, e o astryx doctor aponta os projetos cuja documentação para agentes ou integrações saíram do padrão.
Antes de decidir
- Configuração
- npm install @astryxdesign/core, um pacote de tema e @stylexjs/stylex, mais @astryxdesign/cli como dependência de desenvolvimento; adicione alguns imports de CSS e um provider de tema. Há guias para Next.js, Vite, Tailwind e uso por CDN. React 19+ e Node 22+ para quem contribui.
- Integrações
- Componentes React tipados; CLI com os comandos search, component, hook, docs, template, theme, swizzle, upgrade e doctor, todos com saída --json; codemods de atualização, inclusive para atualizar componentes copiados do shadcn; pacotes de integração podem adicionar componentes e documentação.
- Dados e privacidade
- Uma biblioteca do lado do cliente, sem serviço hospedado. A CLI lê a documentação do pacote instalado e avisa quando há versão mais nova; o README não descreve telemetria. Licença MIT sem limites comerciais.
- Custo em escala
- Gratuito em qualquer escala. O custo é tempo de engenharia: atualizações durante o beta 0.x e a manutenção de qualquer componente copiado com swizzle.
- Limites
- Beta, com versões várias vezes por semana e 679 issues e pull requests abertos. Gráficos só em canary; o pacote experimental lab não é publicado. Apenas React 19 ou mais recente.
O que é bom
- Mais de 150 componentes acessíveis, com modelos de páginas inteiras
- A CLI responde em JSON tipado a partir da versão instalada
- CSS já compilado; sobrescreva com Tailwind ou CSS puro
- Sete temas, ajustados por propriedades personalizadas de CSS
- Licença MIT, sem plano pago
O que não é
- Ainda em beta na versão 0.7.x; versões frequentes
- Exige React 19 ou mais recente
- Gráficos só em uma tag canary
- Componentes copiados com swizzle passam a ser seus para manter
Ideal para
Times de React que estão começando um app ou ferramenta interna nova e esperam que agentes de programação escrevam boa parte do front-end a partir de um conjunto de componentes documentado.
Alternativas ao Astryx
Astryx: perguntas frequentes
- Astryx vale a pena?
- Uma biblioteca de componentes madura com uma CLI incomumente pensada para agentes, que vale a adoção em um app novo em React 19, embora o rótulo beta e a versão 0.x signifiquem que mudanças incompatíveis ainda fazem parte do acordo. Damos nota 4.0 de 5.
- Quanto custa Astryx?
- Gratuito sob a licença MIT; sem plano pago.
- Quais são as desvantagens de Astryx?
- Ainda em beta na versão 0.7.x; versões frequentes; exige React 19 ou mais recente; gráficos só em uma tag canary; componentes copiados com swizzle passam a ser seus para manter.
- Para quem Astryx é indicado?
- Times de React que estão começando um app ou ferramenta interna nova e esperam que agentes de programação escrevam boa parte do front-end a partir de um conjunto de componentes documentado.
- Quanto custa Astryx para uma equipe ou em produção?
- Gratuito em qualquer escala. O custo é tempo de engenharia: atualizações durante o beta 0.x e a manutenção de qualquer componente copiado com swizzle.
- Astryx é seguro para dados da empresa?
- Uma biblioteca do lado do cliente, sem serviço hospedado. A CLI lê a documentação do pacote instalado e avisa quando há versão mais nova; o README não descreve telemetria. Licença MIT sem limites comerciais.
- Quais são as melhores alternativas ao Astryx?
- As alternativas mais próximas que analisamos são Impeccable, Hallmark e OpenDesign.
Respostas verificadas em 11 de nov. de 2026.
Você faz o Astryx? Mostre esta nota no seu site
