Needless UI

Componentes

Cada componente é construído sobre elementos nativos e documentado com exemplos interativos, sua API e seu comportamento de teclado.

  • Avatar

    A foto de uma pessoa, ou as iniciais dela sobre uma cor que é sempre a mesma.

  • Breadcrumbs

    A trilha de páginas que leva até a página atual.

  • Button

    Ações e links, com o estilo aplicado diretamente a botões e links nativos.

  • Calendário

    Escolha um dia, um intervalo ou vários dias, também pelo teclado.

  • Carrossel

    Slides em uma fileira que rola e se encaixa, com botões, pontos e rotação.

  • Chat

    Converse com um modelo: respostas em streaming, ferramentas, versões e arquivos.

  • Seletor de cor

    Uma cor em OKLCH, em uma área ou em uma roda, com amostras, conta-gotas e verificação de contraste.

  • Combobox

    Um campo de texto que sugere opções enquanto você digita.

  • Paleta de comandos

    Todos os comandos do seu app, a uma tecla de distância.

  • Seletor de data

    Digite uma data ou hora em segmentos, ou escolha em um calendário.

  • Dialog

    Uma janela modal sobre o elemento dialog nativo, com o foco gerenciado pelo navegador.

  • Dropzone

    Solte arquivos ou escolha-os, com validações, prévias e uploads com progresso.

  • Editor de texto rico

    Títulos, listas, links e formatos, com barra de ferramentas e Markdown enquanto você digita.

  • Estado vazio

    O que mostrar quando não há nada para mostrar, e o que fazer a respeito.

  • Grade de dados

    Ordene, filtre, agrupe, edite e exporte qualquer quantidade de linhas.

  • Markdown

    Renderize Markdown com segurança, mesmo enquanto ele chega em streaming.

  • Máscara de entrada

    Campos de texto que se formatam enquanto você digita: datas, cartões, IBANs, códigos.

  • Menu

    Uma lista suspensa de ações, com submenus, itens marcáveis e suporte completo a teclado.

  • Campo numérico

    Uma entrada de números com botões de passo, formatada para cada localidade.

  • Campo OTP

    Códigos de verificação em caixas separadas, sobre uma única entrada real.

  • Campo de telefone

    Um seletor de país e um número, agrupado do jeito que o país escreve.

  • Popover

    Painéis flutuantes ao lado de um botão e tooltips ricos ao passar o mouse.

  • Avaliação

    Estrelas para avaliar, sobre botões de rádio de verdade.

  • Agendador

    Eventos em um mês, uma semana, um dia, uma agenda ou uma timeline de salas e pessoas, arrastados até o lugar certo.

  • Select

    Escolha uma opção ou várias, de uma lista curta ou enorme.

  • Skeleton

    Espaços reservados que mantêm o layout enquanto o conteúdo carrega.

  • Splitter

    Painéis lado a lado ou empilhados, com alças para redimensioná-los.

  • Toast

    Mensagens curtas que se empilham, saem com um deslize e nunca roubam o foco.

  • Tour

    Um card para cada etapa, ao lado do que ela explica, com a página escurecida em volta.