• Building 3D Websites With Spline and Framer (No-Code)
  • scroll progress bar thumbnail
  • fixed footer thumbnail
  • Framer Overlays: Creating Dropdown Menus And Tooltips thumbnail

Framer University Lessons

Learn from my bite-sized Framer tutorials where I show you how to create stunning effects and animations on your websites.

Search all lessons…

Latest lesson

Building 3D Websites With Spline and Framer (No-Code)

3D

SPLINE

Building 3D Websites With Spline and Framer (No-Code)

Building 3D Websites With Spline and Framer (No-Code)

Building 3D Websites With Spline and Framer (No-Code)

Building 3D Websites With Spline and Framer (No-Code)

Building 3D Websites With Spline and Framer (No-Code)

All lessons

scroll progress bar thumbnail

PROGRESS BAR

CODE OVERRIDE

Framer Tutorial: Creating Scroll Progress Bars

scroll progress bar thumbnail

Framer Tutorial: Creating Scroll Progress Bars

scroll progress bar thumbnail

Framer Tutorial: Creating Scroll Progress Bars

fixed footer thumbnail

FOOTER

FIXED POSITIONING

Framer Tutorial: Creating Fixed Footers (New Trend)

fixed footer thumbnail

Framer Tutorial: Creating Fixed Footers (New Trend)

fixed footer thumbnail

Framer Tutorial: Creating Fixed Footers (New Trend)

Framer Overlays: Creating Dropdown Menus And Tooltips thumbnail

FRAMER UPDATE

OVERLAYS

Framer Overlays: Creating Dropdown Menus And Tooltips

Framer Overlays: Creating Dropdown Menus And Tooltips thumbnail

Framer Overlays: Creating Dropdown Menus And Tooltips

Framer Overlays: Creating Dropdown Menus And Tooltips thumbnail

Framer Overlays: Creating Dropdown Menus And Tooltips

Framer Tutorial: Creating Smooth Website Loading Animations

COMPONENTS

INTERACTIONS

Framer Tutorial: Creating Smooth Website Loading Animations

Framer Tutorial: Creating Smooth Website Loading Animations

Framer Tutorial: Creating Smooth Website Loading Animations

Framer Tutorial: Creating Smooth Website Loading Animations

Framer Tutorial: Creating Smooth Website Loading Animations

Recreating The Apple Siri Website

WEBSITE REBUILD

STICKY POSITIONING

Recreating The Apple Siri Website with Framer

Recreating The Apple Siri Website

Recreating The Apple Siri Website with Framer

Recreating The Apple Siri Website

Recreating The Apple Siri Website with Framer

Website Language Switcher With AI (Framer No-Code)

FRAMER UPDATE

SITE LOCALIZATION

Website Language Switcher With AI (Framer No-Code)

Website Language Switcher With AI (Framer No-Code)

Website Language Switcher With AI (Framer No-Code)

Website Language Switcher With AI (Framer No-Code)

Website Language Switcher With AI (Framer No-Code)

New Apple Watch Website with Framer (No-Code)

WEBSITE REBUILD

SCROLL ANIMATION

New Apple Watch Website with Framer (No-Code)

New Apple Watch Website with Framer (No-Code)

New Apple Watch Website with Framer (No-Code)

New Apple Watch Website with Framer (No-Code)

New Apple Watch Website with Framer (No-Code)

WEBSITE REBUILD

ANIMATIONS

iPhone 15 Pro Website with Framer (No-Code)

iPhone 15 Pro Website with Framer (No-Code)

iPhone 15 Pro Website with Framer (No-Code)

Waitlist Site With Framer + Airtable

WAITLIST SITE

FRAMER + AIRTABLE

Waitlist Site With Framer + Airtable (FREE & No-Code)

Waitlist Site With Framer + Airtable

Waitlist Site With Framer + Airtable (FREE & No-Code)

Waitlist Site With Framer + Airtable

Waitlist Site With Framer + Airtable (FREE & No-Code)

parallax tutorial thumbnail

Scroll speed

Parallax

Framer Tutorial: No-Code Parallax Effect

parallax tutorial thumbnail

Framer Tutorial: No-Code Parallax Effect

parallax tutorial thumbnail

Framer Tutorial: No-Code Parallax Effect

scroll zoom animation thumbnail

Scroll transform

Advanced

Framer Tutorial: Advanced Scroll Zoom Animation

scroll zoom animation thumbnail

Framer Tutorial: Advanced Scroll Zoom Animation

scroll zoom animation thumbnail

Framer Tutorial: Advanced Scroll Zoom Animation

website tempalte thumbnail

Template

Personal

Build Your Personal Website With My Framer Template

website tempalte thumbnail

Build Your Personal Website With My Framer Template

website tempalte thumbnail

Build Your Personal Website With My Framer Template

Framer AI thumbnail

AI

Website generator

Framer Tutorial: Generate A Live Website With AI

Framer AI thumbnail

Framer Tutorial: Generate A Live Website With AI

Framer AI thumbnail

Framer Tutorial: Generate A Live Website With AI

Framer input component thumbnail

Components

Alerts

Framer Tutorial: How To Use The Input Component

Framer input component thumbnail

Framer Tutorial: How To Use The Input Component

Framer input component thumbnail

Framer Tutorial: How To Use The Input Component

curved carousel thumbnail

Scroll variant

Sticky positioning

Framer Tutorial: No-Code Animated Curved Carousel

curved carousel thumbnail

Framer Tutorial: No-Code Animated Curved Carousel

curved carousel thumbnail

Framer Tutorial: No-Code Animated Curved Carousel

Framer best practices thumbnail

Checklist

10 Things To Do Before Publishing a Framer Website

Framer best practices thumbnail

10 Things To Do Before Publishing a Framer Website

Framer best practices thumbnail

10 Things To Do Before Publishing a Framer Website

Figma to Framer thumbnail

Figma

Framer

Go From Figma to Live Website in 20 Minutes

Figma to Framer thumbnail

Go From Figma to Live Website in 20 Minutes

Figma to Framer thumbnail

Go From Figma to Live Website in 20 Minutes

200 IQ

Scroll transform

Framer Tutorial: No-Code 3D Tilted Scrolling for Your Website

Framer Tutorial: No-Code 3D Tilted Scrolling for Your Website

Framer Tutorial: No-Code 3D Tilted Scrolling for Your Website

advanced scroll animation thumbnail

Scroll transform

Sticky positioning

Framer Tutorial: Advanced Scroll Animation

advanced scroll animation thumbnail

Framer Tutorial: Advanced Scroll Animation

advanced scroll animation thumbnail

Framer Tutorial: Advanced Scroll Animation

Tesla website in Framer thumbnail

Code overrides

Framer Tutorial: How To Make A Tesla Style Website in Framer

Tesla website in Framer thumbnail

Framer Tutorial: How To Make A Tesla Style Website in Framer

Tesla website in Framer thumbnail

Framer Tutorial: How To Make A Tesla Style Website in Framer

no-code scroll animation thumbnail

Scroll transform

Exploitation

Framer Tutorial: How To Create A No-Code Scroll Animation

no-code scroll animation thumbnail

Framer Tutorial: How To Create A No-Code Scroll Animation

no-code scroll animation thumbnail

Framer Tutorial: How To Create A No-Code Scroll Animation