Générateur de texte à gradient en CSS Créez des effets de texte percutants avec des gradients à plusieurs couleurs et du CSS prêt à être utilisé en un clic. Choisissez vos couleurs, sélectionnez linéaire ou radial, observez la prévisualisation en temps réel, puis collez le snippet dans votre feuille de style. Utilisation : Entrez le texte d'exemple que vous souhaitez prévisualiser. Définissez la taille et le poids de la police...
Essayez l'outil »Générateur d'image de carte sociale Open Graph Créez des images de partage sociales parfaites en pixels pour Open Graph, Twitter Cards, LinkedIn et Facebook directement dans votre navigateur. Entrez votre titre, votre description et le nom de votre site, choisissez un layout et un thème, puis téléchargez un PNG, JPG ou WebP aux dimensions exactes attendues par chaque plateforme — sans outil de conception ni upload.
Essayez l'outil »Générateur de CSS Neumorphique Créez des éléments d'interface doux, avec effet de relief « neumorphique » sans avoir à ajuster manuellement deux ombres de boîte opposées. Choisissez une couleur de base, sélectionnez une forme (plat, concave, convexe ou pressé), déplacez les curseurs pour définir la distance, l'intensité, le flou et l'angle de lumière, puis copiez le CSS généré directement dans votre projet. Utilisation : Choisissez une couleur de fond. La même couleur...
Essayez l'outil »Générateur de teintes et de tons de couleur Sélectionnez une couleur en hexadécimal ou en RGB et obtenez immédiatement 10 teintes (votre couleur mélangée vers le blanc) et 10 tons (mélangés vers le noir) sous forme de vignettes visuelles. Cliquez sur n'importe quelle vignette pour copier son code hexadécimal, ou exportez l'ensemble sous forme de propriétés CSS, de variables SCSS, de JSON ou d'une liste simple de codes hexadécimaux...
Essayez l'outil »Générateur d'échelle de couleurs de Tailwind CSS Coller une seule couleur en hexadécimal et obtenez instantanément une palette complète de 50 à 950 selon le style de Tailwind, avec des étapes perçues de manière égale. L'échelle est construite dans l'espace de couleur OKLCH, donc chaque étape semble être une progression de luminosité égale à l'œil humain — pas simplement une chute linéaire en RGB ou en HSL. ...
Essayez l'outil »Canvas d'art en pixels & exportation CSS Créez des sprites en style 8 bits nets directement dans votre navigateur et exportez-les sous forme d'art en ombres de boîtes en CSS, SVG échelonnables, PNG raster ou JSON portables. Le canvas s'étend de 8×8 à 64×64, dispose de palettes classiques (NES, Game Boy, PICO-8, CGA, Commodore 64, Sweetie 16) et vous offre un pinceau, un effaceur, ...
Essayez l'outil »Visualiseur et éditeur SVG : Coller toute la propriété d'un chemin SVG d et le voir rendu en direct. Ce outil décompose chaque commande en ses paramètres et en son point final absolu, affiche des gestionnaires de points de contrôle de Bézier sur la prévisualisation, et réécrit le chemin entre coordonnées absolues et relatives avec une précision configurable. Il est conçu pour les auteurs SVG...
Essayez l'outil »Générateur de Flexbox (Visuel) Conception de layouts Flexbox de manière visuelle et copie de CSS prêt à l'usage. Personnalisez la direction, l'alignement, le wrapping, le gap et les surcharges par élément tout en consultant instantanément une prévisualisation en temps réel. Aucune hypothèse, aucune visite de Chrome DevTools — choisissez simplement le comportement du conteneur, observez-le se rendre visible et copiez les règles générées. Comment utiliser ? Choisissez une direction de flex (ligne, ...
Essayez l'outil »Générateur d'icônes pour README Le Générateur d'icônes pour README crée des badges de qualité pixel par pixel, dans le style de Shields.io, directement dans votre navigateur. Choisissez un modèle prédéfini ou concevez votre propre étiquette et message, sélectionnez des couleurs et un style (plat, carré plat, pour-le-badge, ou plastique), et obtenez une sortie prête à l'emploi au format Markdown, HTML, SVG et URL de données. Aucun appel à API externe, aucune dépendance réseau, aucun badge cassé...
Essayez l'outil »Générateur d'animation CSS Créez des animations CSS @keyframes de manière visuelle avec une prévisualisation en temps réel. Choisissez parmi 10 préférences populaires comme bounce, shake, pulse, fade in, slide in, spin, swing, rubber band, flash et wobble — ou concevez votre propre animation à partir de zéro. Ajustez la durée, l'interpolation, le nombre d'itérations, la direction et le mode de remplissage, puis copiez le ...
Essayez l'outil »Calculateur de spécificité CSS Le Calculateur de spécificité CSS vous aide à déterminer le score exact de spécificité d'un sélecteur CSS. Comprendre la spécificité est essentiel pour diagnostiquer les conflits CSS et écrire des feuilles de style maintenables. Entrez un ou plusieurs sélecteurs et voyez immédiatement leurs scores (a,b,c) comparés côté à côté. Comment utiliser Entrez un sélecteur CSS par ligne dans ...
Essayez l'outil »Générateur de filtres CSS Le Générateur de filtres CSS vous permet de créer visuellement des effets de filtre CSS avec un aperçu d'image en direct. Ajustez les propriétés de filtre individuelles à l'aide de curseurs intuitifs et voyez les résultats instantanément — sans deviner. Une fois que vous êtes satisfait du résultat, copiez le code CSS généré et collez-le directement dans votre feuille de style. Comment utiliser ...
Essayez l'outil »Simulateur et Vérificateur de Daltonisme Voyez comment vos images et palettes de couleurs apparaissent aux personnes ayant une déficience de la vision des couleurs. Simulez 8 types de CVD et testez vos conceptions pour la conformité au contraste WCAG afin d'assurer l'accessibilité pour tous les utilisateurs. Comment l'utiliser Téléchargez une image ou entrez des valeurs de couleur pour simuler. Sélectionnez une déficience de la vision des couleurs ...
Essayez l'outil »Générateur CSS Clip-Path Créez visuellement des formes CSS clip-path avec un éditeur intuitif par glisser-déposer. Créez des polygones, des cercles, des ellipses et des formes incrustées, puis copiez le CSS généré directement dans vos feuilles de style. Comment l'utiliser Sélectionnez un type de forme ou commencez à partir d'un modèle prédéfini. Faites glisser les points de contrôle pour ajuster la forme visuellement sur le canevas de prévisualisation. Le ...
Essayez l'outil »Extracteur de palette de couleurs Téléchargez n'importe quelle image et extrayez instantanément sa palette de couleurs dominante. Utilise la quantification par coupe médiane pour identifier les couleurs les plus proéminentes, vous donnant des valeurs HEX, RGB et HSL précises avec des pourcentages d'utilisation. Comment l'utiliser Téléchargez une image en la faisant glisser et en la déposant ou en cliquant sur la zone de téléchargement. L'outil analyse automatiquement l'image ...
Essayez l'outil »Convertisseur HSV en RGB Convertissez instantanément entre les espaces colorimétriques HSV (Teinte, Saturation, Valeur) et RGB avec aperçu visuel en direct. Ajustez la teinte, la saturation et la valeur à l'aide de curseurs intuitifs et observez la mise à jour en temps réel des valeurs RGB et HEX correspondantes. Comment l'utiliser Ajustez les curseurs HSV — Teinte (0-360°), Saturation (0-100 %), et Valeur (0-100 %) — ...
Essayez l'outil »Calculateur de distance de couleur Calculez la différence perceptive entre deux couleurs à l'aide des formules standard de l'industrie CIE deltaE. Entrez les couleurs via des codes HEX ou des sélecteurs de couleurs et voyez instantanément à quel point elles apparaissent différentes à l'œil humain, avec des résultats provenant de trois algorithmes deltaE et une interprétation en langage clair. Comment l'utiliser Entrez deux couleurs à l'aide de codes HEX ou du ...
Essayez l'outil »Convertisseur LAB en RGB Convertissez les valeurs de couleur CIE L*a*b* en formats RGB et HEX avec une précision scientifique. Cet outil effectue le pipeline complet de transformation LAB vers XYZ vers RGB en utilisant l'illuminant standard D65 et une correction gamma sRGB appropriée, avec aperçu visuel des couleurs et détection hors gamut. Comment l'utiliser Entrez vos valeurs LAB — L ...
Essayez l'outil »Convertisseur de couleurs HEX en noms de couleurs Convertissez instantanément tout code couleur HEX en son nom de couleur CSS/HTML le plus proche. Entrez une valeur hexadécimale ou utilisez le sélecteur de couleurs visuel pour trouver le nom de couleur correspondant le plus proche parmi les 140 noms de couleurs CSS3 standard, avec des scores de similarité et des comparaisons visuelles côte à côte. Comment l'utiliser Entrez un ...
Essayez l'outil »Générateur d'ombres de boîte CSS Concevez de belles ombres de boîte visuellement avec un aperçu en direct. Ajoutez plusieurs couches d'ombre, ajustez les décalages, le flou, l'étalement et la couleur, puis copiez le CSS — sans codage manuel. Comment utiliser Ajustez les curseurs pour le décalage horizontal et vertical, le rayon de flou, l'étalement et l'opacité. Basculez l'inset pour les ombres intérieures. Ajoutez jusqu'à ...
Essayez l'outil »Ajoutez des outils IO à votre navigateur préféré pour un accès instantané et une recherche plus rapide
Tableau de Bord est une façon amusante de suivre vos jeux, toutes les données sont stockées dans votre navigateur. D'autres fonctionnalités arrivent bientôt !
Mise à jour: Notre dernier outil a été ajouté le 17 mai 2026
Aidez-nous à continuer à fournir des outils gratuits et précieux
