Herramientas de Diseño y CSS

Genera degradados CSS, sombras, y radios de borde, y verifica el contraste de color para la web. 17 herramientas — Funciona completamente en tu navegador.

Totalmente local

Verificador de contraste de color

Comprueba si un par de colores de texto/fondo cumple con los estándares de contraste de accesibilidad WCAG.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de gradientes CSS

Crea visualmente un gradiente CSS lineal o radial y copia el código.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de box-shadow CSS

Diseña visualmente un box-shadow CSS con controles deslizantes y copia el código generado.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de border-radius CSS

Diseña visualmente esquinas redondeadas — incluyendo formas asimétricas — y copia el código CSS.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Conversor de PX a REM

Convierte entre píxeles y unidades rem, según un tamaño de fuente raíz personalizado.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Extractor de Paleta de Colores

Extrae los colores más dominantes de cualquier imagen, con códigos HEX, RGB y CSS

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de capturas de código

Pega código y conviértelo en una imagen pulida con fondo degradado y barra de título, lista para compartir

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Simulador de daltonismo

Mira cómo se ve tu imagen para alguien con daltonismo (protanopía, deuteranopía, tritanopía o acromatopsia)

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de clip-path CSS

Elige una forma predefinida (círculo, triángulo, estrella, burbuja de mensaje...) y copia el código clip-path.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de curva de aceleración Cubic Bezier

Arrastra dos puntos para diseñar visualmente una curva de aceleración personalizada y copia el código cubic-bezier.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de Glassmorphism CSS

Diseña visualmente un efecto de tarjeta de vidrio esmerilado y copia el código CSS listo para usar.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de diseño CSS Grid y Flexbox

Diseña visualmente un diseño Grid o Flexbox con vista previa en vivo y copia el código CSS listo para usar.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Convertidor de texto a escritura a mano

Convierte texto escrito a máquina en una imagen que parece escrita a mano en papel rayado, en varios estilos de letra.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de blobs y patrones de fondo SVG

Genera una forma orgánica aleatoria (blob) o un patrón de fondo repetitivo sin costuras en SVG, y cópialo o descárgalo.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de animaciones CSS Keyframe

Diseña una animación CSS visualmente (aparecer, deslizar, zoom, rebote, rotar, voltear) y obtén código @keyframes listo para usar.

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de armonía de paletas de colores

Elige un color base y obtén una paleta de colores armoniosa (complementaria, análoga, triádica, tetrádica, monocromática).

Herramientas de Diseño y CSSAbrir herramienta

Totalmente local

Generador de degradado mesh

Crea un fondo de degradado mesh suave y multipunto con un clic, y copia el código CSS listo para usar.

Herramientas de Diseño y CSSAbrir herramienta

Herramientas relacionadas

Herramientas de IA Herramientas de Texto Herramientas PDF Herramientas de Imagen

Herramientas