cubic-bezier() est une fonction de temporisation CSS qui définit comment une animation accélère et décélère. Ses quatre valeurs — x1, y1, x2, y2 — sont deux points de contrôle d'une courbe qui associe le temps à la progression. L'axe X représente le temps (0 à 1) et l'axe Y la progression de l'animation.
Choisissez un préréglage ou faites glisser les points de contrôle orange sur la toile pour façonner votre courbe d'easing. La balle animée montre exactement le ressenti de votre temporisation, et la sortie CSS est prête à coller dans n'importe quelle transition ou animation.
Frequently Asked Questions
Q: Qu'est-ce que cubic-bezier en CSS ?
Qu'est-ce que cubic-bezier en CSS ? C'est une fonction de temporisation utilisée dans les transitions et animations qui définit la courbe de vitesse : à quelle vitesse une animation progresse dans le temps. La valeur par défaut est cubic-bezier(0.25, 0.1, 0.25, 1), aussi appelée ease.
Q: Quelles sont les valeurs d'easing standard ?
Quelles sont les valeurs d'easing standard ? ease = (0.25, 0.1, 0.25, 1), ease-in = (0.42, 0, 1, 1), ease-out = (0, 0, 0.58, 1), ease-in-out = (0.42, 0, 0.58, 1) et linear = (0, 0, 1, 1).
Q: Comment créer un effet de rebond ?
Comment créer un effet de rebond ? Dépassez les valeurs Y au-delà de 1, comme cubic-bezier(0.34, 1.56, 0.64, 1). La courbe dépasse brièvement la cible puis revient — un rebond type ressort.
Q: Pourquoi mon animation semble cassée avec Y négatif ?
Pourquoi mon animation semble cassée avec Y négatif ? Un Y négatif crée de l'anticipation — l'élément recule avant d'avancer. C'est intentionnel pour les effets de back-easing mais semble faux pour la plupart des transitions de contenu.
Q: Peut-on utiliser cubic-bezier dans les animations ?
Peut-on utiliser cubic-bezier dans les animations ? Oui, dans les transitions comme dans les animations @keyframes, via la propriété timing-function. Cela s'applique aussi aux animations liées au scroll.
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.