Herramientas de diseño que escriben el CSS por ti.
Constructores visuales para degradados, sombras, border-radius y favicons: copia el CSS o descarga el archivo cuando quede como quieres. Todo en tu navegador, nada se sube.
Herramientas de diseño
Generador de degradados CSS
Crea degradados lineales o radiales de forma visual, copia el CSS.
Abrir herramientaGenerador de sombras (box-shadow)
Crea sombras simples o en varias capas de forma visual, copia el CSS.
Abrir herramientaGenerador de border-radius
Crea un border-radius por esquina de forma visual, copia el CSS.
Abrir herramientaGenerador de favicon
Sube una imagen y genera un favicon en todos los tamaños que necesites.
Abrir herramientaExtractor de paleta de colores
Extrae los colores dominantes de cualquier imagen.
Abrir herramientaVerificador de contraste
Ratio de contraste WCAG con resultado AA/AAA.
Abrir herramientaConversor de color
HEX, RGB, HSL y CMYK, en vivo y sincronizados.
Abrir herramientaGenerador de CSS Clamp()
Define un tamaño mínimo y máximo, obtén un valor clamp() fluido que escala con el viewport.
Abrir herramientaGenerador de Curvas de Aceleración CSS
Arrastra dos tiradores para dar forma a una curva de aceleración personalizada, copia el valor cubic-bezier().
Abrir herramientaGenerador de Filtros CSS
Suelta una imagen, arrastra los deslizadores, copia el valor CSS filter.
Abrir herramientaGenerador de Patrones CSS
Construye un patrón de fondo repetible con degradados CSS puros, sin necesidad de imagen.
Abrir herramientaGenerador de Blobs SVG
Genera una forma orgánica aleatoria tipo blob, ajusta la aleatoriedad y el número de puntos, copia o descarga.
Abrir herramientaGenerador de Textura de Ruido
Genera una textura de grano con densidad, opacidad y color ajustables, descarga o copia como CSS.
Abrir herramientaGenerador de Sombras para Tailwind
Construye una sombra por capas de forma visual, obtén una clase Tailwind shadow-[...] más el CSS puro.
Abrir herramienta