7.450 elementos de interface de graça, e você copia no formato que quiser.
O Uiverse é a biblioteca aberta de botões, loaders, cards e campos feita pela comunidade. Cada elemento sai em HTML e CSS, Tailwind, React ou Figma, e pode ir pra projeto de cliente. Onde fica cada formato e qual é a parte paga.
Tem uma biblioteca com 7.450 elementos de interface feitos pela comunidade, todos de graça, e você copia cada um no formato que o seu projeto usa. É o Uiverse.
Botão, loader, card, chave de liga e desliga, campo, tooltip, formulário. É justamente o detalhe que a IA costuma resolver com o padrão de sempre, e que deixa a página com cara de template.
O que tem lá
Na página de elementos tudo fica separado por categoria na lateral: botões, checkboxes, chaves, cards, loaders, campos, botões de opção, formulários, padrões e tooltips. Em cima dá pra filtrar só o que é feito em Tailwind ou só em CSS, e mudar a ordem.
Cada cartão é o elemento rodando de verdade. Você passa o mouse e o efeito acontece ali, sem abrir nada.
Os quatro formatos
Clicando no elemento, abre a página dele: a prévia de um lado e o código do outro.
- HTML e CSS: as duas abas no topo do código, cada uma com o botão Copiar.
- Tailwind: nos elementos feitos em Tailwind, que você acha pelo filtro da página de elementos.
- React: o botão Exportar gera a versão em React. Ela usa uma biblioteca chamada styled-components, e a própria janela explica como instalar ou como levar os estilos pro seu CSS.
- Figma: Copiar pro Figma leva o elemento pro seu arquivo. Esse pede conta no site, que é grátis.
Se você trabalha com IA de código, o caminho mais simples é copiar o HTML e o CSS, colar no chat junto com o arquivo da sua página e pedir pra ela adaptar o elemento ao projeto, mantendo o efeito.
Busque pelo que você está construindo
Mais embaixo na home tem uma seção que junta os elementos por necessidade: carregamento, efeitos de botão, cards, estilos modernos (vidro, neumorfismo, degradê, modo escuro), formulários e dicas. É o caminho mais rápido quando você sabe o que falta na página e não sabe o nome.
Grátis e pago
Os elementos são todos grátis. A home diz 100% grátis pra uso pessoal e comercial, e o rodapé de cada página diz que todo o conteúdo sai com licença MIT, que libera usar, mudar e colocar em projeto de cliente.
O pago é outra coisa: os design systems pra IA, pacotes com paleta, tipografia, componentes e regras de uso pra colocar no projeto e a IA de código seguir. Hoje eles aparecem entre US$ 9,99 e US$ 19,99 cada, com acesso a todos por US$ 34,99, e a página anuncia 50% de desconto pra quem entra no acesso antecipado.
O que eu faria
Escolheria um elemento só pra cada função da página: um botão principal, um loader, um card, um campo. Copiaria o código de cada um, colocaria no projeto e pediria pra IA usar esse padrão na página inteira, sem inventar um segundo botão. O ganho está em escolher quatro e repetir em tudo, e não em trocar de efeito a cada seção.
E como cada elemento é feito por uma pessoa diferente, vale conferir na prévia se ele combina com o fundo e a fonte do seu site antes de copiar.
O site é este: uiverse.io.