Skip to main content
Penguin ToolsOutils Pingouin

Générateur CSS Cubic Bezier

Créez visuellement des courbes d'accélération pour animations CSS. Déplacez les poignées et prévisualisez les animations en temps réel.

Préréglages

Éditeur de courbe

P1(0.25, 0.10)
P2(0.25, 1.00)

Aperçu

Durée

1.0s

Sortie

cubic-bezier(0.25, 0.10, 0.25, 1.00)
transition: all 1.0s cubic-bezier(0.25, 0.10, 0.25, 1.00);
Partager cet outil
📖

Comment utiliser

Step 1

Ajuster la courbe

Ajuster la courbe

Faites glisser les poignées de la courbe de Bézier

Step 2

Aperçu

Aperçu

Vérifiez avec l'aperçu d'animation

Step 3

Copier

Copier

Copiez le code CSS pour l'utiliser

✨

Fonctionnalités

Contrôle par glissement

Faites glisser les points de contrôle pour ajuster la courbe

Préréglages

Préréglages comme ease, ease-in, ease-out

Aperçu d'animation

Prévisualisez l'accélération avec une animation en direct

❓

FAQ

Une fonction d'accélération définissant les courbes d'accélération des animations.

🔗Outils associés

🎨
Outils de design

Convertisseur de codes couleur

Convertissez entre les codes couleur HEX, RGB et HSL. Utilisez le sélecteur de couleur et l'aperçu en temps réel pour une sélection intuitive.

🎨
Outils de design

Sélecteur de couleur

Choisissez des couleurs intuitivement avec un cercle chromatique et des curseurs. Obtenez et copiez les codes couleur aux formats HEX, RGB et HSL.

🎨
Outils de design

Extracteur de couleurs d'image

Détectez automatiquement les couleurs dominantes d'une image et générez une palette de couleurs. Vous pouvez aussi cliquer n'importe où sur l'image pour sélectionner des couleurs individuelles.

🎯
Outils de design

Sélecteur de couleur moyenne d'image

Calculez la couleur moyenne d'une image entière ou d'une zone sélectionnée. Utile pour choisir des palettes de couleurs ou des couleurs d'arrière-plan de vignettes.

🌈
Outils de design

Générateur de dégradés CSS

Créez visuellement des dégradés CSS avec des contrôles par glissement. Prise en charge des dégradés linéaires, radiaux et coniques avec préréglages.

🔲
Outils de design

Générateur CSS Box Shadow

Créez visuellement des box-shadow CSS avec des curseurs. Prise en charge des ombres multiples et des ombres intérieures.