Outils · CSS · Créer une ombre CSS

Créer une ombre CSS

Créez une ombre CSS multicouche (box-shadow) avec un aperçu en direct, puis copiez le code.

Déposez un fichier ici, ou choisissez-en un.

Fonctionne entièrement dans votre navigateur. Aucun fichier n'est envoyé.

Comment ça marche

  1. Partez d'un préréglage, ou réglez vous-même le décalage, le flou, l'extension et la couleur d'une couche.

  2. Ajoutez d'autres couches pour donner de la profondeur (4 au total maximum), ou supprimez-en.

  3. Copiez le CSS box-shadow terminé.

Questions fréquentes

Oui, jusqu'à quatre couches. Elles s'affichent dans l'ordre où vous les ajoutez, qui est aussi l'ordre dans lequel le CSS les applique - la première couche est donc la plus proche de l'élément.

Le décalage horizontal et vertical déplace l'ombre. Le flou adoucit son bord. L'extension agrandit ou réduit l'ombre avant que le flou ne soit appliqué.

Elle dessine l'ombre à l'intérieur de la bordure de l'élément plutôt qu'à l'extérieur, pour un effet enfoncé.

Non. Tout se passe dans votre navigateur, rien n'est envoyé nulle part.

Commentaires

  1. Aucun commentaire pour le moment. Soyez le premier à partager votre expérience.
Votre note (facultatif)

Aucune note sélectionnée