Soft CSS Box Shadow: codice già pronto
Costruisci visivamente il codice box-shadow CSS: cursori per offset, sfocatura, diffusione, colore con opacità, modalità inserita e fino a quattro livelli con un'anteprima dal vivo.
Risultato
Questa pagina apre il generatore di box-shadow precaricato con un'ombra morbida: nessun offset orizzontale, 8px verso il basso, una generosa sfocatura di 24px e una bassa opacità del nero pari al 12%. La scheda di anteprima ne esegue il rendering immediatamente: sposta qualsiasi cursore e la linea CSS seguirà in tempo reale.
Le ombre morbide sono il cavallo di battaglia delle interfacce moderne. Una grande sfocatura abbinata a una bassa opacità solleva una carta dalla pagina senza tracciare un contorno netto, motivo per cui la maggior parte dei sistemi di progettazione mantiene le ombre di elevazione esattamente in questo intervallo invece delle ombre dense e scure del primo design piatto.
Copia la linea d'ombra del riquadro direttamente nel tuo foglio di stile o impila fino a tre ulteriori livelli per un'elevazione più ricca. Il generatore funziona interamente nel tuo browser: nulla viene caricato da nessuna parte.