Pular para o conteúdo
Portfólio

HTM UI

Componentes acessíveis para Preact e htm, distribuídos como ES modules nativos — sem build, sem JSX e sem bundler.

Ver projeto →

O HTM UI é um conjunto de componentes para Preact e htm. Os arquivos são ES modules nativos. Uma página os carrega com import map ou por uma CDN. No caminho padrão não há compilação de JSX nem bundler.

As APIs e os tokens ficam próximos do ecossistema shadcn/ui. A implementação, o catálogo e a identidade são do próprio HTM UI.

Documentação do HTM UI, com botões ao vivo, um gráfico e o registro de componentes

Como uma página usa

import { html } from "htm/preact";
import { Button } from "htm-ui/button.js";

function App() {
  return html`<${Button} variant="outline">Click me<//>`;
}

O caminho por arquivo (htm-ui/button.js) é a API documentada. Um index.js também exporta o conjunto para um único import. O estilo é Tailwind CSS v4, com cn() para juntar classes e Iconify para ícones.

O app de documentação mostra o registro no navegador: djalmajr.github.io/htm-ui. Uma skill de agente no mesmo repositório cobre escolha de componente, tema e a checagem do resultado no navegador.

Código