100% en el navegador
Herramientas de CSS
Genera CSS limpio y listo para copiar y pegar de forma visual con estas herramientas gratuitas: sombras de caja, degradados, border-radius, flexbox, grid, animaciones, clip-paths y filtros, con una vista previa en vivo mientras ajustas cada valor.
⬛
Generador de Box Shadow CSS
Diseña una box-shadow visualmente con vista previa en vivo y copia el CSS.
⬭Generador de Border Radius CSS
Ajusta el radio de cada esquina con vista previa en vivo y copia el CSS.
▤Generador de Gradientes CSS
Crea un gradiente lineal o radial con vista previa en vivo y copia el CSS.
TGenerador de Text Shadow CSS
Diseña una text-shadow con vista previa en vivo y copia el CSS.
▲Generador de Triángulos CSS
Genera un triángulo de puro CSS en cualquier dirección y copia el CSS.
⬓Área de Pruebas de CSS Flexbox
Experimenta con las propiedades de flexbox en una vista previa en vivo y copia el CSS generado.
▦Generador de CSS Grid
Genera una maquetación con CSS grid con columnas, filas y espaciado ajustables, con vista previa en vivo.
⤢Generador de CSS Transform
Combina translate, rotate, scale y skew en una sola transformación CSS con vista previa en vivo.
⌒Generador de Curvas de Easing CSS
Elige o crea una curva de easing cubic-bezier y reprodúcela en un punto de vista previa animado.
▢Generador de Glassmorphism
Crea el CSS de una tarjeta de vidrio esmerilado con desenfoque, transparencia, saturación y un color de tinte.
◇Generador de clip-path CSS
Recorta un elemento en formas comunes y copia el CSS de clip-path.
☼Generador de filtros CSS
Compón filtros CSS con controles deslizantes y vista previa en vivo, luego copia.
⤿Generador de animaciones CSS
Crea una animación con fotogramas clave, previsualízala en vivo y copia el CSS.
◜Generador de spinner CSS
Genera un spinner de carga con CSS puro y copia el CSS.
▩Patrón de fondo CSS
Genera un patrón de fondo CSS con dos colores y cópialo.
◳Generador de neumorfismo
Crea sombras neumórficas de soft-UI con vista previa en vivo y copia.
@Generador de media queries CSS
Crea una @media query responsiva con ajustes predefinidos y cópiala.
▌Estilizador de barra de desplazamiento CSS
Estiliza una barra de desplazamiento personalizada y copia el CSS de ::-webkit-scrollbar.
▭Caja de relación de aspecto CSS
Genera una caja de relación de aspecto adaptable con una alternativa de padding.
‖Diseño multicolumna CSS
Genera un diseño de texto multicolumna CSS con una línea divisoria.
T○Contorno de texto CSS
Añade un contorno o trazo al texto y copia el CSS.