Generador CSS de efecto arcilla

Este generador CSS de efecto arcilla te ayuda a crear bloques de interfaz suaves, con esquinas redondeadas y sombras en capas con aspecto de arcilla. Ajusta el color de fondo, el tamaño de vista previa, el radio del borde, la dirección de la sombra, la profundidad, el desenfoque y la opacidad, y copia el CSS generado para usarlo en tu proyecto.

Box

px
px
{{ radius }}px

Sombra

{{ depth }}px
{{ blur }}px
px
px
{{ blur }}px
{{ outerAlpha.toFixed(2) }}
{{ innerDarkAlpha.toFixed(2) }}
{{ innerLightAlpha.toFixed(2) }}

Vista previa

{{ width }} x {{ height }}px
Clay

CSS

Copied!