Saltar al contenido
BIBLIOTECA

Controles para aplicaciones reales

Cuadrículas, gráficos, planificadores, editores y más. Cada control tiene su propia página en lenguaje claro, fácil de leer para desarrolladores y para asistentes de IA.

TodosFreeComplete
BotonesTexto y númerosSelección de listaDeslizadores y valoraciónColor y archivoEditoresSelecciónFecha y horaFormulariosDiseñoNavegaciónSuperposicionesComentariosContentDatos ligerosArrastrarPreferenciasUtilidadesDatosGráficosDiagramasPlanificaciónEspacio de trabajoOffice

Botones 9 controles

001 ButtonFree El botón sobre el que se construye toda tu aplicación: tres estilos, seis colores, iconos y protección contra dobles clics.002 IconButtonFree Un botón compacto para barras de herramientas, con nombre accesible integrado.003 ButtonGroupFree Une acciones relacionadas en un control ordenado, listo para selectores de vista.004 ToggleButtonFree Un botón que permanece activado o desactivado.005 SplitButtonFree Una acción principal con acciones relacionadas a un clic de distancia.006 FloatingActionButtonFree Mantén la acción principal siempre al alcance.007 SpeedDialFree Un botón flotante que abre una lista corta de acciones.008 ProgressButtonFree Un botón que muestra su propio progreso mientras se ejecuta el trabajo.009 CopyButtonFree Un clic para copiar, con una confirmación clara.

Texto y números 9 controles

010 TextFieldFree El cuadro de texto sobre el que se construyen tus formularios, con mensajes de validación debajo.011 NumericFieldFree Entrada de números que respeta los límites y el formato de tus usuarios.012 PercentFieldFree Escribe porcentajes con naturalidad mientras el valor sigue siendo una fracción limpia.013 MoneyFieldFree Escribe importes como los escriben tus usuarios, en su propia cultura.014 MaskedInputFree Guía a las personas para escribir teléfonos, códigos e identificadores en el formato correcto.015 OtpInputFree Una casilla por carácter para códigos de verificación, con escritura y pegado fluidos.016 SearchBoxFree Búsqueda con icono, botón de borrado y tu propia acción de búsqueda.017 PasswordStrengthFree Muestra qué tan fuerte es una contraseña y qué reglas cumple.018 InPlaceEditorFree Edita un valor justo donde se muestra: clic, cambiar, guardar.

Selección de lista 10 controles

019 SelectFree Elige un elemento de una lista desplegable, para cualquier tipo de valor.020 DropDownListFree Elige entre listas de cualquier longitud, incluso cientos de miles de entradas, sin ralentizaciones.021 MultiSelectFree Elige varios elementos de una lista desplegable, con Seleccionar todo y Borrar.022 ListBoxFree Una lista siempre visible, para una opción o varias.023 AutocompleteFree Lleva a las personas a la respuesta correcta más rápido reduciendo una lista larga mientras escriben.024 MultiColumnComboBoxFree Busca en una lista que muestra varias columnas a la vez.025 CascaderFree Deja que los usuarios elijan en una jerarquía, nivel por nivel.026 DropDownTreeFree Elige un nodo de una jerarquía desde una lista desplegable compacta.027 TagInputFree Añade tags libres con Intro o una coma.028 MentionFree Menciona a colegas con @ directamente en un cuadro de texto.

Deslizadores y valoración 5 controles

029 SliderFree Elige un número arrastrando.030 RangeSliderFree Elige un valor inferior y uno superior con un solo control.031 RangeSelectorFree Elige un intervalo de una serie de datos con dos controles.032 RatingFree Recoge valoraciones con estrellas con un solo clic.033 RatingDisplayFree Muestra valoraciones con medias estrellas, una puntuación y un número de reseñas.

Color y archivo 5 controles

034 ColorPickerFree Deja que los usuarios elijan colores con un selector, un código hexadecimal o ajustes predefinidos.035 ColorPaletteFree Una cuadrícula de muestras de color fácil de recorrer y de usar con el teclado.036 ColorButtonFree Un botón de color de barra de herramientas conocido que siempre muestra el color elegido.037 FileUploadFree Arrastra y suelta o elige archivos, con comprobación de tamaño y tipo integrada.038 SignaturePadFree Recoge firmas manuscritas con ratón, dedo o lápiz.

Editores 2 controles

039 MarkdownEditorFree Escribe Markdown con una barra de herramientas y vista previa en vivo.040 AddressFieldFree Dirige un mensaje en segundos: cada dirección se convierte en un chip claro, con sugerencias mientras escribes.

Selección 9 controles

041 CheckboxFree Un simple sí o no que funciona con tus formularios y la validación.042 CheckboxGroupFree Deja que los usuarios elijan varios elementos de una lista, claramente etiquetados.043 RadioFree Una sola opción de un grupo de radio, para cuando cada elección necesita su propia etiqueta o contenido.044 RadioGroupFree Una elección clara de una lista corta.045 SwitchFree Un interruptor claro de encendido y apagado.046 ChipFree Etiquetas compactas para tags y filtros, que se pueden quitar cuando haga falta.047 ChipSetFree Convierte los chips en filtros que se seleccionan de uno en uno o varios a la vez.048 ToggleGroupFree Un control segmentado para selectores de vista y opciones.049 TransferListFree Mueve elementos entre dos listas para elegir un subconjunto.

Fecha y hora 12 controles

050 CalendarFree Un calendario que encaja en tus páginas, en el idioma de tus usuarios.051 DatePickerFree Elige una fecha de un calendario, en el idioma y formato que tus usuarios conocen.052 DateTimePickerFree Elige fecha y hora en un solo campo.053 DateTimeRangePickerFree Selecciona un periodo en un calendario que muestra dos meses, con rangos rápidos.054 MonthPickerFree Elige un mes y un año sin elegir un día.055 YearPickerFree Elige un año en una cuadrícula clara.056 WeekPickerFree Elige una semana entera con un clic.057 TimeFieldFree Un cuadro de hora en el formato del idioma del usuario.058 TimePickerFree Introduce una hora en el formato que esperan tus usuarios.059 TimeRangePickerFree Elige una hora de inicio y de fin en un solo campo.060 TimeSpanPickerFree Introduce una duración en días, horas, minutos y segundos.061 EventCalendarFree Una vista mensual con eventos que se leen de un vistazo.

Formularios 7 controles

062 ErrorSummaryFree Reúne todos los errores de un formulario en un lugar claro.063 FormLayoutFree Organiza etiquetas y campos en una cuadrícula adaptable con secciones tituladas.064 FormStateFree Bloquea o congela un formulario entero con un solo ajuste.065 LoginFormFree Un formulario de inicio de sesión listo con validación amable.066 RegisterFormFree Un formulario de registro listo con validación amable.067 CaptchaFree Una primera comprobación ligera contra bots simples, sin servicio externo.068 FormBuilderFree Crea formularios a partir de una lista de definiciones de campos en lugar de marcado.

Diseño 15 controles

069 ContainerFree Mantén el contenido con un ancho cómodo en cada pantalla.070 StackFree Organiza elementos en fila o columna con espaciado uniforme.071 GridFree Una cuadrícula de 12 columnas que cambia con el tamaño de pantalla.072 GridItemFree Una celda de la cuadrícula, con su ancho para cada tamaño de pantalla fijado con unos pocos valores simples.073 SpacerFree Empuja elementos al extremo de una fila.074 DividerFree Una línea fina que deja respirar al contenido.075 CardFree Un contenedor limpio que agrupa contenido relacionado con encabezado y pie.076 PanelFree Una sección con título que puede contraerse y llevar sus propias acciones.077 FieldsetFree Agrupa campos relacionados bajo un encabezado claro.078 ToolbarFree Una fila de herramientas, lista para el teclado.079 SplitterFree Paneles redimensionables que los usuarios ajustan con ratón, tacto o teclado.080 AccordionFree Mantén ordenadas las páginas largas: muestra una sección a la vez, o varias si tus usuarios lo prefieren.081 CollapseFree Muestra los detalles solo cuando los usuarios los piden.082 TagCloudFree Muestra palabras en tamaños que siguen su importancia.083 TitleIndexFree Una lista agrupada por la primera letra con una barra de letras rápida.

Navegación 19 controles

084 AppBarFree Una barra superior limpia que se adapta desde escritorios amplios hasta teléfonos pequeños.085 DrawerFree Un panel lateral para navegación o detalles que no estorba.086 NavMenuFree Navegación vertical que resalta la página actual.087 NavItemFree Un enlace del menú de navegación, con icono y etiqueta, resaltado cuando su página está abierta.088 NavGroupFree Un grupo plegable de enlaces en el menú de navegación, para que los menús largos sean fáciles de recorrer.089 TabsFree Organiza el contenido en paneles entre los que los usuarios cambian.090 StepperFree Guía a los usuarios por un proceso paso a paso.091 WizardFree Guía a los usuarios por un proceso con pasos que pueden comprobarse u omitirse.092 BreadcrumbsFree Muestra siempre dónde está el usuario y da una vía de vuelta con un clic.093 MenuFree Un botón que abre una lista clara de acciones.094 MenuItemFree Una entrada de un menú, con icono opcional, lista para el teclado y el ratón.095 ContextMenuFree Pon las acciones adecuadas bajo el botón derecho del ratón.096 MenuBarFree Una barra de menús de aplicación clásica con atajos y submenús.097 CommandContextMenuFree Menús de clic derecho con atajos, marcas y submenús, construidos a partir de una sola lista de comandos.098 TextContextMenuFree Un conocido menú de clic derecho para campos de texto.099 ProfileMenuFree Muestra al usuario con sesión iniciada con avatar, nombre y menú.100 PaginationFree Recorre listas largas página a página.101 TreeViewFree Jerarquías fáciles de recorrer con teclado o ratón.102 ScrollSpyFree Un índice que acompaña al lector por una página larga.

Superposiciones 10 controles

103 DialogFree Diálogos enfocados que mantienen a los usuarios en el camino y funcionan con el teclado.104 DialogHostFree El lugar donde aparecen los diálogos.105 PopoverFree Un panel flotante para más detalle, a mano.106 TooltipFree Una breve pista al pasar el ratón o con el foco, sin script.107 OverlayFree Atenúa la página para centrar la atención.108 LightboxFree Un visor a pantalla completa para imágenes, con botones anterior y siguiente, flechas y Esc.109 TourFree Guía a los nuevos usuarios por tu aplicación paso a paso.110 ColorDialogFree Pide un color al usuario en un diálogo listo, con una línea de código.111 FontDialogFree Pide una fuente al usuario en un diálogo listo, con una línea de código.112 SnackbarHostFree El lugar donde aparecen los mensajes breves.

Comentarios 12 controles

113 AlertFree Di lo que importa, con el tono adecuado: mensajes claros de éxito, advertencias y errores.114 BadgeFree Una pequeña etiqueta de estado que hace evidente la situación en listas y menús.115 BusyOverlayFree Mantén informados a los usuarios mientras algo carga y evita clics accidentales.116 CookieConsentFree Pide con amabilidad la elección de cookies y recuerda la respuesta.117 EmptyStateFree Convierte una página vacía en un siguiente paso útil.118 NotificationCenterFree Una campana con el número de notificaciones sin leer y un panel para verlas.119 ProgressBarFree Muestra hasta dónde ha llegado algo.120 ProgressCircularFree Un anillo que muestra el progreso de un vistazo.121 ResultPageFree Cuenta a los usuarios cómo fue: éxito, error, no encontrado o sin acceso.122 SkeletonFree Marcadores de posición que hacen que la carga parezca más rápida.123 SkeletonPresetFree Marcadores de carga listos para tarjetas, listas, tablas y perfiles.124 SpinnerFree Una señal clara de que algo está cargando.

Content 21 controles

125 TypographyFree Títulos y texto que se mantienen coherentes en toda tu aplicación.126 IconFree Una biblioteca coherente de iconos en un estilo limpio.127 ImageFree Imágenes con texto alternativo obligatorio, leyendas y carga diferida.128 ImageGalleryFree Una cuadrícula de miniaturas que se abre en un visor a pantalla completa.129 AvatarFree Pon una cara o iniciales junto a cada nombre y haz que las listas se sientan personales.130 AvatarGroupFree Muestra un equipo entero en poco espacio, con un simple +n para el resto.131 LinkFree Enlaces que se ven bien y manejan con seguridad las direcciones externas.132 StatisticFree Números grandes con etiqueta y tendencia, hechos para paneles.133 DescriptionsFree Muestra los detalles de un registro en una cuadrícula ordenada que también cabe en pantallas pequeñas.134 TimelineFree Cuenta la historia de un registro como una secuencia vertical de eventos.135 CarouselFree Presenta lo destacado como diapositivas, con controles que se pueden pausar.136 CountdownFree Cuenta atrás hasta un lanzamiento, una fecha límite o una oferta.137 HighlighterFree Marca las coincidencias de búsqueda dentro del texto para que los usuarios las encuentren al instante.138 MarqueeFree Una franja desplazable para avisos breves que los usuarios pueden pausar.139 CodeBlockFree Muestra código de forma legible, con una ligera coloración de sintaxis.140 MarkdownFree Muestra texto Markdown con elegancia, con manejo seguro de enlaces y HTML.141 QrCodeFree Crea códigos QR en tu página, sin servicio de imágenes.142 BarcodeFree Imprime códigos de barras escaneables directamente desde tu aplicación, sin servicio de imágenes.143 PricingTableFree Tarjetas de planes con precios, funciones y un interruptor mensual o anual.144 CommentThreadFree Añade debates a cualquier registro, con respuestas y un cuadro para comentarios nuevos.145 ActivityFeedFree Muestra quién hizo qué y cuándo, agrupado por días, para que los equipos sepan siempre qué cambió.

Datos ligeros 5 controles

146 TableFree Una tabla ordenada para datos simples y estáticos.147 ListFree Listas con iconos, dos líneas de texto y acciones en cada fila.148 RepeaterFree Muestra una lista con tu propia plantilla, encabezado y mensaje de lista vacía.149 VirtualListFree Desplázate con fluidez por cientos de miles de elementos.150 PropertyGridFree Edita las propiedades de cualquier objeto en una lista agrupada y ordenada.

Arrastrar 1 controles

151 SortableFree Deja que los usuarios reordenen una lista arrastrando o con botones.

Preferencias 4 controles

152 ThemeToggleFree Cambia entre temas claro y oscuro con un clic.153 ThemeMenuFree Deja que los usuarios elijan tema y densidad desde un solo menú.154 DensityToggleFree Deja que los usuarios elijan entre la densidad cómoda y la compacta de toda la aplicación.155 LanguageToggleFree Cambia el idioma de toda la interfaz, inglés o búlgaro, con un solo control.

Utilidades 5 controles

156 BreakpointObserverFree Crea diseños que reaccionan al tamaño de pantalla con una única señal simple.157 FullscreenFree Deja que los usuarios amplíen gráficos, imágenes o editores a pantalla completa.158 HotkeyFree Añade atajos de teclado que los usuarios avanzados adorarán.159 InfiniteScrollFree Carga más contenido cuando el lector llega al final de una lista.160 ScrollToTopFree Un botón que lleva a los lectores de vuelta arriba.

Datos 7 controles

161 DataGridComplete Una cuadrícula para las tablas en las que viven tus usuarios: ordenar, filtrar, agrupar, editar y exportar.162 TreeListComplete Un árbol y una tabla en uno, con orden, filtro y elección de columnas.163 PivotGridComplete Deja que los usuarios resuman una lista en una tabla cruzada y exploren las cifras.164 QueryBuilderComplete Deja que los usuarios construyan consultas con grupos anidados de condiciones.165 DataFilterComplete Da a los usuarios una forma amable de construir filtros a partir de condiciones.166 FileExplorerComplete Da a los usuarios un explorador de archivos conocido para tu propio almacenamiento.167 FileManagerComplete Un administrador de archivos completo: carpetas, búsqueda, orden, renombrado y carga.

Gráficos 26 controles

168 LineChartComplete Muestra tendencias en el tiempo con varias series y una leyenda en la que se puede hacer clic.169 AreaChartComplete Muestra totales y proporciones de un vistazo con áreas apiladas, porcentuales o superpuestas.170 BarChartComplete Compara valores con claridad con barras verticales u horizontales, agrupadas o apiladas.171 ComboChartComplete Combina barras y líneas en ejes compartidos para contar una sola historia.172 PieChartComplete Muestra las partes de un todo como gráfico circular o de anillo.173 RadarChartComplete Compara varias medidas a la vez en un solo gráfico.174 ScatterChartComplete Revela relaciones entre dos números.175 BubbleChartComplete Añade una tercera dimensión a un diagrama de dispersión: burbujas más grandes para valores mayores.176 HistogramComplete Mira cómo se distribuyen los valores por rangos.177 BoxPlotComplete Muestra cómo se dispersa un conjunto de números, no solo su promedio.178 HeatmapChartComplete Revela patrones en una tabla de números mediante el color.179 CalendarHeatmapComplete Mira un año entero de actividad de una vez, más oscuro donde hay más.180 TreemapChartComplete Muestra proporciones como rectángulos: cuanto mayor el valor, mayor el área.181 SunburstChartComplete Muestra una jerarquía como anillos concéntricos.182 SankeyChartComplete Muestra cómo fluyen las cantidades de una etapa a la siguiente.183 FunnelChartComplete Muestra dónde abandonan las personas entre etapas.184 WaterfallChartComplete Explica cómo aumentos y disminuciones suman un total.185 CandlestickChartComplete Presenta apertura, máximo, mínimo y cierre de cada periodo, como esperan los operadores.186 SparklineComplete Una pequeñísima línea de tendencia que cabe en una frase o una celda de tabla.187 GaugeComplete Muestra un único valor en un dial claro, con bandas de color.188 LinearGaugeComplete Un medidor recto para un valor, horizontal o vertical.189 BulletChartComplete Muestra el progreso hacia un objetivo en muy poco espacio.190 MapComplete Colorea regiones por valor y añade marcadores, a partir de tus propios datos de mapa.191 ChartDataTableComplete Una tabla de datos que acompaña a un gráfico para quienes usan lectores de pantalla.192 ChartLegendComplete La leyenda de un gráfico, donde los usuarios ocultan y muestran series con un clic.193 ChartToolbarComplete Una barra de herramientas para un gráfico con exportación a PNG y SVG y otras acciones.

Diagramas 1 controles

194 DiagramComplete Dibuja diagramas de flujo y organigramas que se organizan solos.

Planificación 4 controles

195 SchedulerComplete Vistas de día, semana, mes y línea de tiempo con eventos repetidos, recursos y arrastrar y soltar.196 SchedulerEventEditorComplete Un formulario listo para crear y cambiar eventos.197 RecurrenceEditorComplete Deja que los usuarios configuren eventos repetitivos en lenguaje claro.198 GanttComplete Planifica proyectos con tareas, subtareas, hitos, dependencias y arrastrar y soltar.

Espacio de trabajo 10 controles

199 RibbonComplete La conocida barra de comandos ribbon, con pestañas, grupos y pestañas contextuales.200 DockLayoutComplete Crea un espacio de trabajo donde los usuarios acoplan, agrupan en pestañas, contraen y separan sus propios paneles.201 WindowComplete Ventanas flotantes que los usuarios pueden mover, redimensionar, minimizar y maximizar.202 DashboardLayoutComplete Deja que los usuarios organicen su propio panel moviendo y redimensionando mosaicos.203 DesktopShellComplete Dale a tu aplicación el aire de un escritorio, con fondo de pantalla y barra de tareas.204 TaskbarComplete Una barra con zona de inicio, nombre de módulo y bandeja para aplicaciones de estilo escritorio.205 KanbanComplete Tableros con tarjetas que se mueven entre columnas arrastrando, tocando o con el teclado.206 ChatComplete Añade conversaciones a tu aplicación con una lista de mensajes y un cuadro de redacción listos.207 MailViewComplete Muestra el correo entrante con seguridad dentro de tu aplicación.208 MessageEditorComplete Un editor ligero para escribir mensajes con formato básico.

Office 13 controles

209 PdfViewerComplete Abre, busca y anota archivos PDF en el navegador, con herramientas de páginas y firmas.210 PdfCompareComplete Mira qué cambió entre dos versiones de un PDF.211 DocumentEditorComplete Un procesador de textos para el navegador que abre y guarda archivos Word, RTF y OpenDocument.212 RichTextEditorComplete Texto con formato en un campo de formulario: negrita, listas, enlaces, imágenes y tablas.213 PresentationEditorComplete Crea y edita presentaciones en el navegador; abre y guarda archivos PowerPoint y OpenDocument.214 SpreadsheetComplete Una hoja de cálculo completa en el navegador con fórmulas, gráficos y archivos Excel.215 ProofingPanelComplete Comprobaciones de ortografía, gramática y lógica en un solo panel.216 DataGridSpreadsheetButtonComplete Deja que los usuarios lleven los datos de una cuadrícula a un archivo de hoja de cálculo con un clic.217 DataGridPdfButtonComplete Un botón que convierte las filas de una cuadrícula de datos en un documento PDF.218 SchedulerPdfButtonComplete Un botón que imprime el planificador en PDF: cuadrícula mensual, columnas de semana o una lista por días.219 ReportButtonComplete Un botón que crea un informe PDF a partir de tus datos con agrupación, totales, gráficos y diseño de página.220 SlideViewComplete Muestra una sola diapositiva de una presentación, para vistas previas y listas de diapositivas.221 PasswordPromptComplete Un diálogo listo que pide la contraseña de un documento cuando un archivo está protegido.

¿Listo para construir con RayCraft?

Empieza gratis o cuéntanos sobre tu proyecto.

Empezar gratis