Directory of lessons
Build a dynamic cursor-tracking glow effect across a Webflow card grid using CSS and native variables. No JavaScript needed! Watch the tutorial now.
Discover how to build a real Webflow cookie consent system using Finsweet Consent Pro. Block trackers and ensure GDPR compliance. Watch the tutorial now!
Build a custom landscape viewport directly inside the Webflow Designer. Test responsive layouts instantly without publishing. Watch the tutorial now!
Master fully accessible GSAP popups in Webflow. Learn to implement ARIA tags, scroll locking, and reversible animations. Watch the masterclass today!
Learn how to build a persistent light and dark mode toggle in Webflow using GSAP and variables. Prevent page flickering today. Watch the tutorial now!
Learn how to build an autonomous CRM workflow using the new Make AI Agent node. Automate lead nurturing and email follow-ups. Watch the full guide now!
Unlock advanced Webflow URL structures by bypassing native folder limits. Learn how to nest category collections for better SEO. Watch the guide now!
Solidify your Webflow foundations by mastering grid, flexbox, and scalable layout systems. Access our free clonable project and start building today!
Master Webflow responsive design! Learn to adapt desktop layouts for mobile using fluid units, flexbox, and the cascade principle. Start building today.
Master Webflow layouts by building custom navbars and footers with Grid and Flexbox. Learn sticky positioning and page anchor links. Watch the tutorial!
Build CMS-driven components and animated FAQ dropdowns in Webflow. Master interactions and fix dropdown overlapping issues. Watch the tutorial now!
Master Webflow component variants and build dynamic CMS collections. Learn how to use CSS Grid for a team section. Watch our full tutorial to get started!
Discover how to build scalable layouts using Webflow components, flexbox, and element properties. Streamline your web design workflow today!
Master Webflow hero section styling with this course! Learn to use HTML tags, fluid typography with clamp(), and combo classes. Start building today.
Learn how to structure a responsive hero section in Webflow. Master containers, flexbox, and padding to improve your layouts. Watch the tutorial now!
Master Webflow by building a real SaaS landing page. Learn flexbox, CMS, components, and fluid layouts in this practical crash course. Watch the lesson!
Automate Webflow form submissions directly into a Notion CRM and trigger Loops confirmation emails. Stop manual data entry and watch the full tutorial now.
Stop spam and automate lead management. Learn how to connect Notion, Make, and Loops to build a clean, deduplicated CRM. Watch the tutorial today!
Build responsive flexbox layout patterns in Webflow. Master even columns, grid layouts, and sidebars step-by-step. Clone the project today!
Build a premium 3D slider in Webflow using native interactions, CSS reflections, and Finsweet CMS. Watch the full step-by-step tutorial today!
Build stunning GSAP and CSS hover micro-interactions in Webflow. Master custom button structures, animation triggers, and performance. Watch the guide!
Learn to control repeat loops, optimize performance with runs on, and configure conditional playback. Watch the guide!
Automate your Notion CRM and Loops email marketing with a two-way Make sync. Learn how to map fields and trigger webhooks. Watch the full tutorial now!
Build a powerful custom CRM in Notion using interconnected People, Companies, and Deals databases. Streamline your visual sales pipeline today!
Master Webflow GSAP interactions! Build complex hover animations and click-based state machines using single event settings. Watch the full tutorial now.
Master GSAP event settings in Webflow. Learn to pause animations on hover, control playback speed, and reverse popups seamlessly. Watch the tutorial now!
Learn how to eliminate page load flicker (FOUC) in Webflow GSAP animations using a simple, reusable CSS pattern. Watch the full tutorial now!
Master Webflow's new GSAP interactions. Compare classic vs GSAP systems, understand triggers and targets, and build page load animations. Watch the guide!
Learn how to build a Swiss style poster animation in Webflow using GSAP. Master clip paths, SVG masking, and smooth motion design. Watch the tutorial!
Master Webflow classes with this complete guide. Learn to use combo classes and global classes to style elements efficiently. Watch the video now!
Build a scalable neon glow effect in Webflow using CSS variables, color-mix, and component variants. Watch the tutorial and clone the project today!
Master interactive hero sections in Webflow. Combine a dynamic cursor spotlight, GSAP hover animations, and custom SVG prism filters. Watch the tutorial!
Master Webflow mega menus by making them responsive across all breakpoints. Fix layout issues and mobile hover states step-by-step. Watch the tutorial now.
Learn how to build a glassy button in Webflow using SVG filters and GSAP hover animations. Improve your site design and grab the free clonable today!
Build smooth hover underline animations in Webflow using box-shadows and CSS transitions. Explore creative variations and clone the project today!
Build a fully structured, accessible mega menu in Webflow. Master flexbox columns, dynamic viewport units, and ARIA labels. Watch the video tutorial now!
Build dynamic, interactive fluid gradient backgrounds in Webflow without code. Customize colors, speed, and CTA hovers. Watch the tutorial now!
Learn how to build GSAP-powered staggered animations and split text effects in Webflow. Master offset time and easing. Watch the full tutorial today!
Build a fully responsive mobile navbar in Webflow. Learn to fix layout bugs, use DVH units, and lock page scroll with CSS. Watch the tutorial now!
Learn to build fully responsive and accessible inner grid borders in Webflow using simple gap and background color tricks. Watch the full tutorial now!
Master building a custom Webflow navbar from scratch. Learn flexbox layout, fluid spacing with the clamp() function, and sleek hover effects. Watch now!
Master CSS positioning in Webflow by learning the differences between static, relative, absolute, fixed, and sticky properties. Watch the tutorial now!
Learn how to add interactive, zero-code water ripple effects to your Webflow site. Boost your design with this fully clonable project today!
Build an Apple-inspired liquid glass navbar in Webflow using native elements, smart layering, and a tiny SVG filter. Elevate your UI design today!
Create a responsive, accessible table of contents in Webflow using custom attributes. Upgrade your CMS blog navigation and improve user experience today!
Build interactive GSAP draggable cards in Webflow. This no-code guide covers static layouts, CMS collections, and custom reset buttons.
Recreate Apple's iconic scroll-triggered image sequence in Webflow using GSAP. No code or Lottie required. Watch the tutorial to get started!
Create a scroll-triggered GSAP disintegration effect in Webflow using simple HTML attributes. No custom code needed. Watch the full tutorial today!
Master how to build flexible and accessible manual or dynamic CMS breadcrumbs in Webflow. Improve site navigation and SEO today. Watch the tutorial!
Build a no-code infinite draggable marquee in Webflow. Learn to add pause-on-hover, responsive speeds, and CMS integration easily. Watch the tutorial now!
Master how to automatically open Webflow dropdowns on page load, scroll, or link click using custom attributes. No JS needed. Watch the tutorial today!
Learn how to create award-winning while-scrolling animations in Webflow without code. Master transform origins and custom triggers. Watch the tutorial now!
Build a fully responsive and accessible horizontal masonry layout in Webflow using Flexbox. Watch the step-by-step no-code video tutorial today!
Create stunning Webflow hover animations that dynamically reveal and stack images using native interactions and minimal custom code. Watch the tutorial!
Master Webflow logo glow animations using custom masking and interactions. Watch this step-by-step tutorial to elevate your site design today!
Master Webflow workspace and site plans using a simple Lego analogy. Learn to easily manage seats, hosting, and site permissions. Watch now!
Create a custom no-code glitch logo animation in Webflow using native hover interactions and CSS filters. Elevate your design and watch the guide now!
Master responsive 3D card scroll animations in Webflow without code. Learn sticky positioning, VH units, and timeline tricks. Watch the tutorial today!
Build a responsive, no-code masonry layout in Webflow using native CSS columns. Learn to prevent content splitting and add animations. Watch now!
Build native scroll animations in Webflow without custom code. Animate logos, text, and 3D objects into your navbar. Start learning today.
Create no-code GSAP staggered slide and fade animations in Webflow using simple custom attributes. Perfect for CMS lists and grids. Watch the tutorial!
Master custom video popups in Webflow. Learn to embed YouTube videos, enable programmatic controls, and customize play buttons. Watch the guide!
Learn how to create responsive staggered animations in Webflow using CSS transition delays. No custom JS required! Watch the full tutorial to get started.
Build a dynamic, CMS-driven grid gallery in Webflow that preserves image aspect ratios using simple custom attributes. Watch the tutorial to get started.
Learn to build a custom video popup in Webflow using a no-code, attributes-only method. Add autoplay, pause, and CMS easily. Watch the tutorial today!
Stop page scrolling in Webflow when a nav menu opens using one CSS rule. Discover how to improve user experience without any JavaScript. Watch now!
Build scalable text reveal animations in Webflow using Custom Elements. Skip the complex code and master inline CSS—watch the tutorial today!
Sync Webflow input fields in real-time without code. Learn to use Finsweet Mirror Input to create dynamic forms and personalized user experiences. Watch now.