132 · Conception et Web

Générateur d'ombre de boîte

Faites glisser les curseurs pour façonner une ombre, regardez l'aperçu et copiez le CSS.

Vos données : Cet outil traite votre saisie dans ce navigateur. CapyHelp ne télécharge pas cette entrée pour générer votre résultat. Détails de confidentialité

Générateur d'ombre de boîte

#1e1b4b

Comment utiliser le générateur d'ombre de boîte

  1. Ajustez le décalage, le flou et la propagation.
  2. Choisissez une couleur et une opacité.
  3. Copiez la ligne d'ombre de boîte.

Des ombres d'apparence naturelle

Les vraies ombres sont douces et légèrement teintées. Un flou important avec une répartition négative, une faible opacité et une touche de couleur provenant de votre dessin semble plus naturel qu'un noir uni. Une deuxième ombre serrée ajoute un bord net, ce que fait l'option « deuxième couche douce ».

Exemples

Y 12px, flou 32px, propagation −8px, 25 %

Une ombre de carte douce

Encart

Un regard pressé

Questions

Box-shadow affecte-t-il la mise en page ?

Non. Les ombres sont dessinées à l’extérieur de l’élément sans rien déplacer autour.

Traduction automatique. Passez en revue les résultats importants.