Ir para o conteúdo
BIBLIOTECA

Controles para aplicativos reais

Grades, gráficos, agendadores, editores e mais. Cada controle tem sua própria página em linguagem clara, fácil de ler para desenvolvedores e para assistentes de IA.

TodosFreeComplete
BotõesTexto e númerosSeleção em listaControles deslizantes e avaliaçãoCor e arquivoEditoresEscolhaData e horaFormuláriosLayoutNavegaçãoSobreposiçõesRetornoContentDados levesArrastarPreferênciasUtilitários

Botões 9 controles

001 ButtonFree O botão sobre o qual todo o seu aplicativo é construído: três estilos, seis cores, ícones e proteção contra cliques duplos.002 IconButtonFree Um botão compacto para barras de ferramentas, com nome acessível embutido.003 ButtonGroupFree Junte ações relacionadas em um único controle organizado, pronto para seletores de visualização.004 ToggleButtonFree Um botão que permanece ligado ou desligado.005 SplitButtonFree Uma ação principal com ações relacionadas a um clique de distância.006 FloatingActionButtonFree Mantenha a ação principal sempre ao alcance.007 SpeedDialFree Um botão flutuante que abre uma lista curta de ações.008 ProgressButtonFree Um botão que mostra o próprio progresso enquanto o trabalho roda.009 CopyButtonFree Um clique para copiar, com uma confirmação clara.

Texto e números 9 controles

010 TextFieldFree A caixa de texto sobre a qual seus formulários são construídos, com mensagens de validação abaixo.011 NumericFieldFree Entrada de números que respeita limites e o formato dos seus usuários.012 PercentFieldFree Digite porcentagens com naturalidade enquanto o valor continua sendo uma fração limpa.013 MoneyFieldFree Digite valores do jeito que seus usuários escrevem, na própria cultura.014 MaskedInputFree Guie as pessoas a digitar telefones, códigos e identificadores no formato certo.015 OtpInputFree Uma caixa por caractere para códigos de verificação, com digitação e colagem suaves.016 SearchBoxFree Busca com ícone, botão de limpar e sua própria ação de busca.017 PasswordStrengthFree Mostre quão forte é uma senha e quais regras ela cumpre.018 InPlaceEditorFree Edite um valor exatamente onde ele aparece: clique, altere, salve.

Seleção em lista 10 controles

019 SelectFree Escolha um item em uma lista suspensa, para qualquer tipo de valor.020 DropDownListFree Escolha em listas de qualquer tamanho, até centenas de milhares de entradas, sem lentidão.021 MultiSelectFree Escolha vários itens em uma lista suspensa, com Selecionar tudo e Limpar.022 ListBoxFree Uma lista sempre visível, para uma escolha ou várias.023 AutocompleteFree Leve as pessoas à resposta certa mais rápido reduzindo uma lista longa enquanto digitam.024 MultiColumnComboBoxFree Pesquise em uma lista que mostra várias colunas ao mesmo tempo.025 CascaderFree Deixe os usuários escolherem em uma hierarquia, um nível por vez.026 DropDownTreeFree Escolha um nó de uma hierarquia em uma lista suspensa compacta.027 TagInputFree Adicione tags livres com Enter ou vírgula.028 MentionFree Marque colegas com @ direto em uma caixa de texto.

Controles deslizantes e avaliação 5 controles

029 SliderFree Escolha um número arrastando.030 RangeSliderFree Escolha um valor inferior e um superior com um único controle.031 RangeSelectorFree Escolha um intervalo de uma série de dados com duas alças.032 RatingFree Colete avaliações com estrelas com um único clique.033 RatingDisplayFree Mostre avaliações com meias estrelas, uma nota e a contagem de avaliações.

Cor e arquivo 5 controles

034 ColorPickerFree Deixe os usuários escolherem cores com um seletor, um código hexadecimal ou predefinições prontas.035 ColorPaletteFree Uma grade de amostras de cor rápida de percorrer e fácil de usar com o teclado.036 ColorButtonFree Um botão de cor de barra de ferramentas conhecido que sempre mostra a cor escolhida.037 FileUploadFree Arraste e solte ou escolha arquivos, com verificação de tamanho e tipo integrada.038 SignaturePadFree Colete assinaturas manuscritas com mouse, dedo ou caneta.

Editores 2 controles

039 MarkdownEditorFree Escreva Markdown com uma barra de ferramentas e pré-visualização ao vivo.040 AddressFieldFree Enderece uma mensagem em segundos: cada endereço vira um chip claro, com sugestões enquanto você digita.

Escolha 9 controles

041 CheckboxFree Um simples sim ou não que funciona com seus formulários e a validação.042 CheckboxGroupFree Deixe os usuários escolherem vários itens de uma lista, claramente rotulados.043 RadioFree Uma única opção de um grupo de opções, para quando cada escolha precisa de seu próprio rótulo ou conteúdo.044 RadioGroupFree Uma escolha clara em uma lista curta.045 SwitchFree Uma chave clara de ligar e desligar.046 ChipFree Rótulos compactos para tags e filtros, removíveis quando necessário.047 ChipSetFree Transforme chips em filtros que as pessoas selecionam um ou vários por vez.048 ToggleGroupFree Um controle segmentado para seletores de visualização e escolhas.049 TransferListFree Mova itens entre duas listas para escolher um subconjunto.

Data e hora 12 controles

050 CalendarFree Um calendário que se encaixa nas suas páginas, no idioma dos seus usuários.051 DatePickerFree Escolha uma data em um calendário, no idioma e no formato que seus usuários conhecem.052 DateTimePickerFree Escolha data e hora em um único campo.053 DateTimeRangePickerFree Selecione um período em um calendário que mostra dois meses, com intervalos rápidos.054 MonthPickerFree Escolha um mês e um ano sem escolher um dia.055 YearPickerFree Escolha um ano em uma grade clara.056 WeekPickerFree Escolha uma semana inteira com um clique.057 TimeFieldFree Uma caixa de hora no formato do idioma do usuário.058 TimePickerFree Digite uma hora no formato que seus usuários esperam.059 TimeRangePickerFree Escolha um horário de início e de fim em um único campo.060 TimeSpanPickerFree Digite uma duração em dias, horas, minutos e segundos.061 EventCalendarFree Uma visão mensal com eventos que se leem de relance.

Formulários 7 controles

062 ErrorSummaryFree Reúna todos os erros de um formulário em um só lugar claro.063 FormLayoutFree Organize rótulos e campos em uma grade responsiva com seções tituladas.064 FormStateFree Bloqueie ou congele um formulário inteiro com uma única configuração.065 LoginFormFree Um formulário de login pronto com validação amigável.066 RegisterFormFree Um formulário de cadastro pronto com validação amigável.067 CaptchaFree Uma primeira verificação leve contra bots simples, sem serviço externo.068 FormBuilderFree Crie formulários a partir de uma lista de definições de campos em vez de marcação.

Layout 15 controles

069 ContainerFree Mantenha o conteúdo com uma largura confortável em cada tela.070 StackFree Organize itens em linha ou coluna com espaçamento uniforme.071 GridFree Uma grade de 12 colunas que muda com o tamanho da tela.072 GridItemFree Uma célula da grade, com sua largura para cada tamanho de tela definida por alguns valores simples.073 SpacerFree Empurre itens para a ponta de uma linha.074 DividerFree Uma linha fina que dá ao conteúdo espaço para respirar.075 CardFree Um contêiner limpo que agrupa conteúdo relacionado com cabeçalho e rodapé.076 PanelFree Uma seção com título que pode recolher e carregar as próprias ações.077 FieldsetFree Agrupe campos relacionados sob um título claro.078 ToolbarFree Uma linha de ferramentas, pronta para o teclado.079 SplitterFree Painéis redimensionáveis que os usuários ajustam com mouse, toque ou teclado.080 AccordionFree Mantenha páginas longas organizadas: mostre uma seção por vez, ou várias se seus usuários preferirem.081 CollapseFree Mostre detalhes só quando os usuários pedirem.082 TagCloudFree Mostre palavras em tamanhos que seguem sua importância.083 TitleIndexFree Uma lista agrupada pela primeira letra com uma barra rápida de letras.

Navegação 19 controles

084 AppBarFree Uma barra superior limpa que se adapta de desktops largos a telefones pequenos.085 DrawerFree Um painel lateral para navegação ou detalhes que não atrapalha.086 NavMenuFree Navegação vertical que destaca a página atual.087 NavItemFree Um link do menu de navegação, com ícone e rótulo, destacado quando sua página está aberta.088 NavGroupFree Um grupo recolhível de links no menu de navegação, para que menus longos fiquem fáceis de percorrer.089 TabsFree Organize o conteúdo em painéis entre os quais os usuários alternam.090 StepperFree Guie os usuários por um processo, uma etapa por vez.091 WizardFree Guie os usuários por um processo com etapas que podem ser verificadas ou ignoradas.092 BreadcrumbsFree Mostre sempre onde o usuário está e ofereça um caminho de volta com um clique.093 MenuFree Um botão que abre uma lista clara de ações.094 MenuItemFree Uma entrada de um menu, com ícone opcional, pronta para o teclado e o mouse.095 ContextMenuFree Coloque as ações certas sob o botão direito do mouse.096 MenuBarFree Uma barra de menus de aplicativo clássica com atalhos e submenus.097 CommandContextMenuFree Menus de clique direito com atalhos, marcas e submenus, criados a partir de uma única lista de comandos.098 TextContextMenuFree Um conhecido menu de clique direito para campos de texto.099 ProfileMenuFree Mostre o usuário conectado com avatar, nome e menu.100 PaginationFree Percorra listas longas página por página.101 TreeViewFree Hierarquias fáceis de percorrer com teclado ou mouse.102 ScrollSpyFree Um sumário que acompanha o leitor por uma página longa.

Sobreposições 10 controles

103 DialogFree Diálogos focados que mantêm os usuários no caminho e funcionam com o teclado.104 DialogHostFree O lugar onde os diálogos aparecem.105 PopoverFree Um painel flutuante para mais detalhes, à mão.106 TooltipFree Uma dica curta ao passar o mouse ou com foco, sem script.107 OverlayFree Escureça a página para focar a atenção.108 LightboxFree Um visualizador em tela cheia para imagens, com botões de anterior e próximo, setas e Esc.109 TourFree Guie novos usuários pelo seu aplicativo, passo a passo.110 ColorDialogFree Peça uma cor ao usuário em um diálogo pronto, com uma linha de código.111 FontDialogFree Peça uma fonte ao usuário em um diálogo pronto, com uma linha de código.112 SnackbarHostFree O lugar onde as mensagens curtas aparecem.

Retorno 12 controles

113 AlertFree Diga o que importa, no tom certo: mensagens claras de sucesso, avisos e erros.114 BadgeFree Um pequeno rótulo de status que deixa o estado óbvio em listas e menus.115 BusyOverlayFree Mantenha os usuários informados enquanto algo carrega e evite cliques acidentais.116 CookieConsentFree Peça com educação a escolha de cookies e lembre a resposta.117 EmptyStateFree Transforme uma página vazia em um próximo passo útil.118 NotificationCenterFree Um sino com a contagem de notificações não lidas e um painel para vê-las.119 ProgressBarFree Mostre quanto algo já avançou.120 ProgressCircularFree Um anel que mostra o progresso de relance.121 ResultPageFree Conte aos usuários como foi: sucesso, erro, não encontrado ou sem acesso.122 SkeletonFree Marcadores que fazem o carregamento parecer mais rápido.123 SkeletonPresetFree Marcadores de carregamento prontos para cartões, listas, tabelas e perfis.124 SpinnerFree Um sinal claro de que algo está carregando.

Content 21 controles

125 TypographyFree Títulos e texto que permanecem consistentes em todo o seu aplicativo.126 IconFree Uma biblioteca consistente de ícones em um estilo limpo.127 ImageFree Imagens com texto alternativo obrigatório, legendas e carregamento adiado.128 ImageGalleryFree Uma grade de miniaturas que abre em um visualizador em tela cheia.129 AvatarFree Coloque um rosto ou iniciais ao lado de cada nome e deixe as listas mais pessoais.130 AvatarGroupFree Mostre uma equipe inteira em pouco espaço, com um simples +n para o resto.131 LinkFree Links com boa aparência que tratam endereços externos com segurança.132 StatisticFree Números grandes com rótulo e tendência, feitos para painéis.133 DescriptionsFree Mostre os detalhes de um registro em uma grade organizada que também cabe em telas pequenas.134 TimelineFree Conte a história de um registro como uma sequência vertical de eventos.135 CarouselFree Apresente destaques como slides, com controles que as pessoas podem pausar.136 CountdownFree Faça uma contagem regressiva até um lançamento, um prazo ou uma oferta.137 HighlighterFree Marque as ocorrências de busca no texto para que os usuários as encontrem na hora.138 MarqueeFree Uma faixa rolante para avisos curtos que os usuários podem pausar.139 CodeBlockFree Mostre código de forma legível, com realce de sintaxe leve.140 MarkdownFree Exiba texto Markdown com elegância, com tratamento seguro de links e HTML.141 QrCodeFree Crie códigos QR na sua página, sem serviço de imagens.142 BarcodeFree Imprima códigos de barras escaneáveis direto do seu aplicativo, sem serviço de imagens.143 PricingTableFree Cartões de planos com preços, recursos e uma chave mensal ou anual.144 CommentThreadFree Adicione discussões a qualquer registro, com respostas e uma caixa para novos comentários.145 ActivityFeedFree Mostre quem fez o quê e quando, agrupado por dia, para que as equipes saibam sempre o que mudou.

Dados leves 5 controles

146 TableFree Uma tabela organizada para dados simples e estáticos.147 ListFree Listas com ícones, duas linhas de texto e ações em cada linha.148 RepeaterFree Mostre uma lista com seu próprio modelo, cabeçalho e mensagem de lista vazia.149 VirtualListFree Role com suavidade por centenas de milhares de itens.150 PropertyGridFree Edite as propriedades de qualquer objeto em uma lista agrupada e organizada.

Arrastar 1 controles

151 SortableFree Deixe os usuários reordenarem uma lista arrastando ou com botões.

Preferências 4 controles

152 ThemeToggleFree Alterne entre temas claro e escuro com um clique.153 ThemeMenuFree Deixe os usuários escolherem tema e densidade em um único menu.154 DensityToggleFree Deixe os usuários escolherem entre a densidade confortável e a compacta de todo o aplicativo.155 LanguageToggleFree Troque o idioma de toda a interface, inglês ou búlgaro, com um só controle.

Utilitários 5 controles

156 BreakpointObserverFree Crie layouts que reagem ao tamanho da tela com um único sinal simples.157 FullscreenFree Deixe os usuários ampliarem gráficos, imagens ou editores para a tela cheia.158 HotkeyFree Adicione atalhos de teclado que os usuários avançados vão adorar.159 InfiniteScrollFree Carregue mais conteúdo quando o leitor chega ao fim de uma lista.160 ScrollToTopFree Um botão que leva os leitores de volta ao topo.

Pronto para construir com o RayCraft?

Comece grátis ou conte sobre o seu projeto.

Começar grátis