Dimensions une extension très pratique pour les web designers
Web to Figma : transformez n'importe quel site en design Figma
CSS Peeper
CSS Peeper est une visionneuse CSS conçue pour les designers, offrant un accès simple et organisé aux styles utiles via une extension Chrome. Son objectif est de permettre aux designers de se concentrer sur le design plutôt que de perdre du temps à fouiller dans les centaines de lignes de code “à la main”.
Avec cet outil, vous pouvez facilement inspecter le style CSS des objets, des couleurs et des actifs sur le web, répondant ainsi à vos questions sur la hauteur de ligne, la police ou la taille des éléments d'un site Web.
Fonts Ninja
Optimisez votre processus de conception en découvrant et en testant les polices de caractères de n'importe quel site web grâce à l'extension Fonts Ninja. En survolant simplement un texte, vous obtiendrez le nom de la police ainsi que les propriétés CSS associées.
De plus, vous pourrez visualiser un résumé de toutes les polices utilisées sur le site. Enregistrez et gérez vos favoris directement dans l'extension pour une organisation optimale. Accélérez votre flux de travail et donnez vie à vos créations avec Fonts Ninja !
Lambdatest
LambdaTest est une extension de test multi-navigateurs où les développeurs et les testeurs peuvent effectuer des tests manuels et automatisés à grande échelle. Avec son infrastructure cloud robuste, LambdaTest prend en charge plus de 2000 navigateurs et versions de navigateur qui sont constamment mis à jour pour vous aider à réduire le temps de test.
Vous pouvez choisir parmi une large gamme de systèmes d’exploitation Windows et Mac, ainsi que tous les navigateurs hérités et les plus récents. Testez également votre site web ou votre application Web sur les derniers navigateurs mobiles avec les systèmes d’exploitation mobiles Android et iOS.
Awesome Screenshot
Avec une stabilité inégalée, un support client réactif et des fonctionnalités adaptées aux besoins professionnels et éducatifs, Awesome Screen Recorder & Screenshot est l'outil parfait pour le travail à distance. Son interface conviviale, combinée à l'absence de publicités intrusives et au respect de la vie privée, en font un choix essentiel pour une communication efficace et professionnelle.
Rejoignez les millions d'utilisateurs satisfaits et profitez de la possibilité d'enregistrer votre écran, onglet ou webcam avec voix et visage. Capturez en plein écran, onglet visible ou zone sélectionnée, et ajoutez des annotations grâce à une barre d'outils complète.
Mobile FIRST
Mobile FIRST est un outil incontournable pour le responsive design, puisqu’il vous permet de prévisualiser instantanément un site sur de nombreux supports. De quoi vous assurer que vos pages web sont aussi lisibles sur un ordinateur que sur un smartphone ou une tablette.
Les principales caractéristiques incluent la possibilité de créer facilement des screencasts au format GIF, de faire une capture d'écran du smartphone en PNG transparent pour une utilisation dans des mails ou des présentations, et un mode nuit disponible.
PixelParallel
PixelParallel est un outil gratuit et pratique pour les développeurs front-end. Il permet de comparer facilement le code HTML avec le design d'un site web. L'outil offre plusieurs fonctionnalités, telles que la personnalisation de l'opacité, de l'échelle et de la position de l'image, ainsi que la différence de couleur pour une précision parfaite des pixels.
Il propose également des grilles verticales et horizontales pour obtenir une conception web précise en pixels. L'outil est également compatible avec les fichiers locaux et dispose d'une interface utilisateur intuitive et minimaliste.
Web Developer
L’extension Web Developer ajoute un bouton de barre d’outils au navigateur avec divers outils de développement Web. Cet outil vous permet de visualiser le code source d’une page, de désactiver Javascript, de gérer les cookies ou encore de cacher les images, tout cela en en un clin d’œil.
Chroma
Chroma est un outil de couleur gratuit et intuitif conçu pour les concepteurs, les développeurs, le marketing et les designers de produits. Il permet d'échantillonner les couleurs de votre écran pendant que vous naviguez sur le web.
Pour l'utiliser, il vous suffit d'ouvrir l'extension, de passer la souris n'importe où sur l'écran avec l'outil pipette et de cliquer pour sélectionner la couleur que vous souhaitez échantillonner. La valeur HEX/RGB/HSL de cette couleur sera automatiquement copiée dans votre presse-papiers. Vous pouvez également créer une palette basée sur une gamme de couleurs de la page et générer un lien unique pour l'enregistrer ou le partager.
WCAG Color contrast checker
L’accessibilité est aujourd’hui un véritable enjeu de webdesign. WCAG Color contrast checker est justement un plugin pratique pour concevoir des sites adaptées aux personnes atteintes d’une déficience visuelle, en simulant par exemple l’apparence d’un site vu par un daltonien.
Cet outil permet de tester le contraste de couleur selon les exigences d'accessibilité WCAG 2.1 en évaluant le contraste des éléments de la page, en prenant en compte les propriétés CSS couleur et couleur de fond, en simulant le daltonisme. De plus, il permet d'introduire manuellement les couleurs à tester et se rafraîchit automatiquement lors des changements dans le DOM de la page.
SVG Export
Le logiciel SVG Export est un outil pratique qui permet de télécharger des fichiers SVG à partir de sites web et de les exporter facilement en tant que PNG, JPEG ou SVG. Il offre plusieurs fonctionnalités intéressantes, notamment la possibilité d'exporter en vrac, de redimensionner les images et de copier les GVS pour les utiliser dans des logiciels de conception tels que Sketch, Figma ou Framer.
De plus, il intègre les styles et les couleurs importants qui sont appliqués avec CSS, ainsi que des nœuds liés provenant d'autres parties du site. Cet outil est particulièrement utile pour les concepteurs et les développeurs qui souhaitent extraire des SVG de sites web sans avoir à examiner le code source.
