Lessons Learned
webflow

How to Organize Custom CSS in Webflow

Written 2023

Instead of placing all your custom style code in one file, Matías Pitters (@masterflowmaker) shared a tip for how to organize CSS in Webflow. (And if you are looking for cloneables to learn from, Pitters did an amazing 100 Days of Webflow interaction series. See them all on Pitters' Webflow profile.)

Organise your custom CSS in @webflow for maintainability and scalability

1️⃣ Reset: Override Webflow defaults
2️⃣ Styles: Use unsupported CSS in Webflow
3️⃣ Variant: Make component variants via dyn custom attributes
4️⃣ SVG: Define icons with <defs>, apply with <use>#WebflowTips pic.twitter.com/8NZS8IDvLB

— Matías Pitters (@masterflowmaker) August 11, 2023