La propriété filter de CSS applique des effets visuels à un élément — flou, luminosité, contraste et réglages de couleur qui fonctionnent sur les images, les fonds et même la vidéo. Contrairement aux éditeurs d'image, les filtres tournent dans le navigateur : ils restent nets à toute résolution et peuvent s'animer en douceur avec des transitions.
Faites glisser les curseurs pour empiler plusieurs fonctions de filtre dans une chaîne. La scène d'exemple se met à jour en temps réel, et le code généré combine tout en une seule déclaration filter prête pour votre feuille de style.
Frequently Asked Questions
Q: Quelles fonctions de filtre CSS existent ?
Quelles fonctions de filtre CSS existent ? blur(), brightness(), contrast(), grayscale(), hue-rotate(), invert(), opacity(), saturate(), sepia() et drop-shadow(). Vous pouvez enchaîner n'importe quel nombre dans une propriété filter.
Q: Le filtre CSS est-il accéléré par GPU ?
Le filtre CSS est-il accéléré par GPU ? Oui. La plupart des fonctions de filtre tournent sur le GPU et s'animent à 60fps. blur() et drop-shadow() sont les plus lourdes ; utilisez-les avec parcimonie sur les grands éléments.
Q: Le filtre affecte-t-il la mise en page ?
Le filtre affecte-t-il la mise en page ? Non. Les filtres sont purement visuels — l'élément garde sa taille et sa position d'origine dans le flux du document. Utilisez transform pour les changements de taille.
Q: Puis-je animer des filtres ?
Puis-je animer des filtres ? Oui. Animez la propriété filter avec transition ou keyframes. L'animation entre différentes chaînes de filtres de même longueur s'interpole en douceur.
Q: Comment rendre une image en niveaux de gris qui se colore au survol ?
Comment rendre une image en niveaux de gris qui se colore au survol ? Utilisez deux états : img { filter: grayscale(100%); transition: filter .4s; } et img:hover { filter: grayscale(0); }. Un motif classique de portfolio.
Couleurs de France
Du bleu de France au rouge coquelicot, la palette française puise dans la mode, l'art et le patrimoine. Des couleurs élégantes et raffinées qui ont marqué l'histoire du design mondial.
Bleu de France #318CE7Le bleu national utilisé depuis les rois capétiens
Rouge Coquelicot #FF3800Le rouge éclatant des champs de coquelicots
Vert Émeraude #50C878La couleur emblématique des bijoux et de la joaillerie
Jaune de Naples #FADA5EPigment historique des peintres depuis la Renaissance
Rose Bonbon #F9429ELe rose sucré de la confiserie et de la mode
Bleu Roi #4169E1Le bleu royal des armoiries et de Versailles
Bordeaux #800020Le rouge sombre des vins de la région bordelaise
Gris Perle #B0B7C3L'élégance discrète des intérieurs parisiens
Lavande #967BB6Les champs de Provence en été
Crème #FFFDD0La douceur des façades haussmanniennes
Q: Qu'est-ce que le bleu de France ?
Qu'est-ce que le bleu de France ? Le bleu de France (#318CE7) est la couleur nationale française, héritée du bleu des armoiries royales depuis le XIIe siècle, reprise aujourd'hui par les équipes sportives nationales.
Q: Qu'est-ce que le rouge coquelicot ?
Qu'est-ce que le rouge coquelicot ? Le coquelicot (#FF3800) est un rouge-orangé vif nommé d'après les fleurs de coquelicot qui fleurissent dans les champs français, popularisé par les impressionnistes.