Soft CSS Box Shadow - Code prêt à l'emploi
Créez visuellement du code CSS box-shadow : curseurs pour le décalage, le flou, la répartition, la couleur avec opacité, le mode incrustation et jusqu'à quatre calques avec un aperçu en direct.
Résultat
Cette page ouvre le générateur d'ombres de boîte préchargé avec une ombre douce : pas de décalage horizontal, 8 pixels vers le bas, un flou généreux de 24 pixels et une faible opacité noire de 12 %. La carte d'aperçu le restitue immédiatement : déplacez n'importe quel curseur et la ligne CSS suit en temps réel.
Les ombres douces sont la bête de somme des interfaces modernes. Un grand flou associé à une faible opacité soulève une carte de la page sans dessiner de contour net, c'est pourquoi la plupart des systèmes de conception conservent leurs ombres d'élévation exactement dans cette plage au lieu des ombres denses et sombres des premiers modèles plats.
Copiez la ligne d'ombre de la boîte directement dans votre feuille de style ou empilez jusqu'à trois calques supplémentaires pour une élévation plus riche. Le générateur fonctionne entièrement dans votre navigateur – rien n’est téléchargé nulle part.