1. Origine
Finsweet est l'un des studios Webflow les plus influents de l'écosystème. Pas uniquement pour les sites qu'il livre, mais pour les outils qu'il met à disposition de toute la communauté : Attributes, Client-First, CMS Bridge.
Extension by Finsweet s'inscrit dans cette logique. À l'origine, c'était une extension Chrome pure : le seul moyen à l'époque d'ajouter des fonctionnalités au Designer Webflow, en injectant directement du code dans le navigateur. Plus de 30 000 développeurs l'ont adoptée. Quand Webflow a ouvert son Marketplace en 2023, Finsweet a saisi l'opportunité : les fonctionnalités principales ont migré dans une App native, plus stable, plus intégrée, sans dépendre d'un navigateur spécifique. L'extension Chrome existe encore pour quelques cas d'usage que l'API Webflow ne couvre pas, mais le produit principal, c'est l'App.
2. Utilité
Un projet Webflow génère de la dette CSS. Pas par négligence, mais par nature : des combo classes créées pour tester une variation, jamais supprimées. Des valeurs en pixels qu'on a oublié de passer en REM. Des styles appliqués deux fois sur des éléments différents. C'est invisible pendant le développement, et ça se remarque à la livraison ou à la reprise. Finsweet Extension traite ces problèmes depuis l'intérieur du Designer, sans export, sans outil externe, et sans passe manuelle.
3. Fonctionnalités
L'App tourne directement dans le Designer Webflow, accessible depuis le Webflow Marketplace. Ses fonctionnalités couvrent les besoins de productivité avancés des développeurs Webflow :
- Dev Mode (beta) : éditeur CSS et HTML intégré directement dans le Designer Webflow, pour modifier le code sans quitter l'interface
- Fluid Design Generator : génère des valeurs CSS fluides responsives (
clamp()) à partir de valeurs min/max et de breakpoints - Merge Combo Classes : identifie et fusionne les combo classes similaires pour réduire la dette CSS
- Migrate PX to REM : convertit automatiquement les valeurs pixel en REM sur tout le projet
- Organize Class Folders : groupe et organise les classes en dossiers structurés dans le panneau de styles
- Page History : consulte et navigue dans l'historique d'édition d'une page
- Remove Duplicate Styles : détecte et nettoie les définitions de styles répétées
- Remove Style Properties : supprime les propriétés de style inutilisées sur les éléments sélectionnés
4. Cas concrets
→ Sur un projet conçu en pixels, Migrate PX to REM convertit l'ensemble des valeurs typographiques et d'espacement en une seule opération. Le résultat : un site qui respecte les préférences de zoom utilisateur et les standards d'accessibilité sans passer manuellement sur chaque classe.
→ Avant chaque livraison, Remove Duplicate Styles et Remove Style Properties font partie de notre checklist. Sur un projet de 40 pages, on élimine systématiquement les styles redondants accumulés en cours de développement, ce qui allège le CSS final et facilite la reprise par un autre développeur.
→ Sur les projets intensifs en animation ou en itérations de design, Merge Combo Classes identifie les doublons et fusionne proprement. On réduit ainsi le poids du CSS et on clarifie le panneau de styles.
5. Prix
Finsweet Extension est gratuite jusqu'à 10 usages par fonctionnalité. Au-delà, un abonnement est requis.
→ finsweet.com/extension/pricing
6. Questions fréquentes
C'est une extension Chrome ou une App Webflow ? Depuis 2024, Finsweet Extension est avant tout une App Webflow native : elle s'installe depuis le Webflow Marketplace et tourne directement dans le Designer. L'extension Chrome continue d'exister en parallèle pour quelques fonctionnalités qui nécessitent un accès direct au navigateur (import de redirections 301 en masse, gestion des breakpoints) : des cas d'usage que l'API Webflow ne permet pas encore de couvrir via une App.
Faut-il être développeur pour l'utiliser ? Non. Des fonctionnalités comme Migrate PX to REM ou Merge Combo Classes sont utiles à tout profil Webflow. Dev Mode est plus orienté développeurs.
Comment l'installer ? Depuis le Webflow Marketplace, directement dans un projet Webflow.
