01
Comprenez ce que vous voyez.
Découvrez le CSS, les dimensions et les polices de chaque élément.
1 mois de Pro offertInspectez le design web.
L’extension Chrome pour designers et développeurs
Inspectez le design web.
Dans Chrome.
Examinez CSS, couleurs, polices et espacements. Vérifiez les mises en page et capturez vos écrans avec une seule extension Chrome.
Puis 0,99 $/mois. Annulez avant la fin de l’essai.
Votre prochaine idée, de plus prèsEssayer la démo
CSS InspectorColor PickerTypographySpacingScreenshotsPage QA
PENSÉ POUR LES DÉTAILS
Le design se joue dans les détails.
Quatre outils restent gratuits. Essayez tous les outils Pro gratuitement pendant un mois.
02
Trouvez vos couleurs.
Extrayez une palette, identifiez les polices et vérifiez le contraste.
03
Chaque pixel à sa place.
Mesurez les espaces, vérifiez la grille, capturez le résultat.
01
Inspecteur Hoverify
GratuitSurvolez un élément pour afficher en temps réel le Box Model, 6 propriétés Typography (font-family, size, weight, line-height, letter-spacing, color), Layout, Background et accessibilité.
02
Extraction de palette de couleurs
ProCollecte automatiquement toutes les couleurs d'une page web et les classe par catégorie via un algorithme de clustering.
03
Inspecteur de polices
ProVérifiez instantanément 6 propriétés des éléments textuels : font-family, size, weight, line-height, letter-spacing et color.
04
Vérification du contraste WCAG
ProCalcule en temps réel le rapport de contraste selon la formule WCAG 2.1. Détermine les niveaux AA (4.5:1) et AAA (7:1).
05
Mesure des espacements
ProAffiche les distances horizontales, verticales et diagonales entre deux éléments en pixels (px) avec des lignes pointillées rouges style Figma.
06
Copie CSS
ProCopiez le CSS calculé d'un élément dans le presse-papiers en un seul clic. Sélection de plage disponible.
07
Grille en superposition
GratuitSuperposez une grille CSS Grid de 12 colonnes pour vérifier visuellement l'alignement de la mise en page.
08
Style Strip
ProSupprimez progressivement le CSS en 4 étapes pour analyser la structure HTML.
09
QA de page
ProVérifiez débordements, descriptions, noms et ordre des titres. Localisez les éléments et exportez le rapport.
10
Palette vers CSS
ProTransformez les couleurs extraites en variables CSS réutilisables. Copiez ou téléchargez en un clic.
Peut-on essayer PixelKit sans l'installer ?
Oui — découvrez les fonctionnalités clés de PixelKit ici même, sans installer l'extension.
De bons outils. Un petit prix.
Les essentiels gratuits. Tout Pro offert pendant un mois.
Free
$0Permanent
Installer gratuitement
- Inspecteur Hoverify
- Color Picker (historique de 5)
- Grid en superposition
- Screenshot (visible uniquement)
Pro Monthly
1 mois de Pro offert$0le premier mois
Puis 0,99 $/mois. Annulez avant la fin de l’essai.
Essayer gratuitement- Toutes les fonctionnalités Free incluses
- Palette Extractor
- Font Inspector
- Spacing Measure
- WCAG Contrast Checker
- CSS Copy / Style Strip
- Visual Editor / Layout Editor
- Quick Theme / Presets
- Tous les outils API
- QA de page, titres et rapports JSON
Pro Lifetime
$19.99Paiement unique
Acheter Pro
- Toutes les fonctionnalités Pro incluses
- Mises à jour à vie
- Support prioritaire
L’essai d’un mois concerne Pro mensuel. Un moyen de paiement est requis. Sans annulation avant la fin de l’essai, l’abonnement se renouvelle à 0,99 $/mois. La licence à vie est un achat séparé de 19,99 $.
1
Lancez votre essai Pro mensuel sur Polar.
2
Retrouvez votre clé dans Polar ou par e-mail.
3
Saisissez la clé dans PixelKit pour activer Pro.
Questions fréquentes
Qu'est-ce que PixelKit ?+
PixelKit est une extension Chrome pour analyser et éditer le design visuel des pages web. Elle propose 8 outils incluant l'inspection CSS, l'extraction de couleurs, l'analyse typographique, la mesure d'espacement et la vérification de contraste WCAG.
Comment installer PixelKit ?+
Recherchez « PixelKit » sur le Chrome Web Store ou cliquez sur le bouton d'installation de la page d'accueil. Prêt à utiliser immédiatement après l'installation.
PixelKit est-il gratuit ?+
Quatre outils sont gratuits à vie. Pro mensuel offre un mois d’essai, puis coûte 0,99 $/mois. La licence à vie coûte 19,99 $.
Comment fonctionne l’essai gratuit ?+
Choisissez Pro mensuel sur Polar et activez votre clé dans l’extension. Un moyen de paiement est requis. Après un mois, le tarif est de 0,99 $/mois, sauf annulation dans Polar avant la fin de l’essai. La licence à vie coûte 19,99 $ séparément.
Comment inspecter le CSS et les polices d’un site ?+
Installez PixelKit depuis le Chrome Web Store et ouvrez un site. Activez l’inspecteur puis survolez un élément pour voir le CSS et la typographie. Pro ajoute l’inspection des polices et la copie du CSS.
Puis-je vérifier une page avant publication ?+
Page QA de Pro vérifie débordements, descriptions d’images, échecs de chargement, champs, boutons et liens sans nom, et niveaux de titres sautés. Localisez les éléments et exportez en JSON. Ces contrôles excluent iframes et Shadow DOM et ne remplacent pas un audit complet d’accessibilité.
Quelles fonctionnalités supplémentaires offre le plan Pro ?+
Le plan Pro ajoute 9 outils : Palette Extractor, Font Inspector, Spacing Measure, WCAG Contrast Checker, CSS Copy, Style Strip, Visual/Layout Editor, Quick Theme et Presets.
Comment fonctionne la vérification de contraste WCAG ?+
Elle calcule en temps réel le rapport de contraste entre le texte et l'arrière-plan selon la formule WCAG 2.1. Elle détermine automatiquement le niveau AA (4.5:1 ou plus) et AAA (7:1 ou plus).
PixelKit fonctionne-t-il sur d'autres navigateurs que Chrome ?+
Oui, PixelKit peut être installé et utilisé sur les navigateurs basés sur Chromium tels que Edge, Brave et Arc via le Chrome Web Store.
1 mois de Pro offert
Votre prochaine idée commence ici.
Découvrez tous les outils Pro gratuitement pendant un mois.
Essayer gratuitementPuis 0,99 $/mois. Annulez avant la fin de l’essai.