Herramientas HTML
Trabaja con HTML, Pug, JSX, componentes SVG y CSS. Adapta el marcado y los estilos para tu próxima implementación.
21 herramientas en esta categoría. Todas funcionan en el navegador y no requieren registro.
Editor de trazados SVG
Modifica un trazado SVG directamente. Mueve los puntos de anclaje y los controles de curva, y después copia el trazado o guarda tu SVG.
Optimizador de SVG
Optimiza SVG estáticos localmente con SVGO. Compara el resultado y descarga archivos individuales o un ZIP.
SVG → JSX
Convierte código SVG en JSX para usarlo en componentes de React.
SVG → React Native
Convierte SVG en componentes de React Native para usar gráficos vectoriales en tu aplicación.
HTML → JSX
Convierte HTML en JSX para reutilizar el marcado en componentes de React.
HTML → Pug
Convierte código HTML en plantillas Pug y revisa el resultado generado.
Markdown → HTML
Convierte texto Markdown a HTML para mostrar contenido con formato en páginas web.
Generador de Flexbox
Organiza un diseño flexible real. Ajusta el contenedor y cada elemento, prueba distintos anchos y obtén el código CSS, HTML o Tailwind.
Generador de rutas de recorte CSS
Da forma directamente sobre el lienzo. Arrastra los vértices del polígono, explora formas redondeadas y exporta CSS o un SVG.
Generador de sombras de caja
Crea profundidad capa a capa. Mueve la luz, ajusta la suavidad y el color, y copia una sombra lista para usar en producción.
Generador de CSS Grid
Dibuja un diseño con CSS Grid de forma visual. Ajusta columnas y filas, arrastra sobre las celdas para nombrar áreas y copia el código CSS, HTML o Tailwind.
Generador de curvas Bézier
Da forma a curvas de aceleración CSS arrastrando dos controles. Compara el movimiento con una temporización lineal y copia cubic-bezier() para transiciones o Tailwind.
Generador de border-radius
Redondea cada esquina, cambia a radios elípticos y arrastra los controles de los bordes para modelar formas orgánicas. Copia el CSS de border-radius o Tailwind.
Generador de glassmorphism
Crea paneles de cristal esmerilado con backdrop-filter. Ajusta el desenfoque, la transparencia, la saturación y el borde sobre un fondo en vivo, y copia el CSS.
Generador de degradados CSS
Crea degradados CSS lineales, radiales y cónicos con paradas de color arrastrables, selector de ángulo y presets. Copia el CSS o una clase de Tailwind. Gratis.
CSS → JS Objects
Convierte declaraciones CSS en objetos JavaScript para usarlas en el código de tu interfaz.
CSS → template literal
Convierte estilos definidos como objetos en literales de plantilla para reutilizarlos en tu código.
CSS → TailwindCSS
Convierte código CSS en clases de Tailwind CSS y revisa las utilidades generadas.
Less → CSS
Compila código Less a CSS estándar para usar los estilos en el navegador.
Scss → CSS
Compila código SCSS a CSS estándar y consulta el resultado generado.
Sass → CSS
Compila código Sass a CSS estándar para usarlo en tus hojas de estilo.