Générateur de Flexbox CSS
Créez visuellement des dispositions CSS avec Flexbox. Voyez le résultat en temps réel pendant que vous ajustez la direction, l'alignement, le retour à la ligne et l'espacement.
display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: nowrap; gap: 8px;
Qu'est-ce que le générateur de Flexbox CSS ?
Flexbox est la manière moderne de disposer les éléments en CSS, bien plus simple que les floats ou le positionnement absolu. Les propriétés sont : flex-direction (ligne ou colonne), justify-content (alignement sur l'axe principal), align-items (axe transversal), flex-wrap et gap. Cet outil les expose toutes avec un aperçu en temps réel.
Questions fréquentes
Flexbox ou Grid ?▼
Outils connexes
Convertisseur de couleur (HEX/RGB/HSL)
Convertissez des couleurs entre les formats HEX, RGB et HSL. Choisissez une couleur visuellement ou saisissez les valeurs manuellement.
Générateur de box-shadow CSS
Créez visuellement des valeurs de box-shadow en CSS. Prévisualisez en temps réel et copiez le CSS généré.
Générateur de dégradés CSS
Créez des dégradés CSS linéaires et radiaux. Choisissez les couleurs visuellement et copiez le CSS généré.
Générateur de courbes d'accélération cubic-bezier
Créez des courbes d'accélération cubic-bezier pour CSS. Inclut des préréglages standard.
Générateur de palettes de couleurs
Générez des palettes de couleurs harmonieuses à partir de n'importe quelle couleur de base. Prend en charge les schémas complémentaires, analogues, triadiques et monochromatiques.
Générateur de border-radius CSS
Créez visuellement des valeurs complexes de border-radius en CSS. Contrôle indépendant de chaque coin.