Sombras realistas para cards sin exagerar el blur

Muchas interfaces planas no fallan porque no tengan sombra. Fallan porque la sombra esta mal planteada. Demasiado blur, demasiada opacidad o una sola capa enorme suelen producir ese efecto de niebla que ensucia el layout.

Una card convincente normalmente necesita capas mas controladas, no mas intensidad.

El error tipico

Una sola sombra grande con mucho blur hace que el componente parezca difuso en vez de elevado. Reduce contraste y da una sensacion blanda que rara vez ayuda.

Un enfoque mejor

Funciona mejor combinar:

• una sombra pequena de contacto;
• una sombra mas amplia para profundidad;
• opacidad ajustada al fondo y no solo al gusto.

box-shadow:
  0 1px 3px rgba(15, 23, 42, 0.08),
  0 12px 28px rgba(15, 23, 42, 0.12);

Cierre

Las sombras realistas para cards no van de meter mas blur. Van de construir profundidad con capas sobrias y consistentes. Si la card se separa del fondo sin parecer envuelta en humo, la sombra ya esta haciendo bien su trabajo.