Part of 100+ video lessons
Short, step-by-step lessons you can rewatch anytime.
Hands-on project
Follow along in the host project and build as you learn.
Certificate path
Counts toward your Framer Fundamentals certificate.
Generate a page to work from, build a component you can't code, then make the images to fill it.
Describe the page and Framer AI builds real frames and elements you can edit, not a flat mockup.
Say what you want and Workshop writes the code component, with property controls in the panel.
AI plugins make the imagery in place, so you're not hunting for a stock photo.
BUILD A COMPONENT YOU COULDN'T CODE
Workshop writes real React, and you get styling controls in the properties panel.
EDIT WHAT THE AI GIVES YOU
Everything lands as frames, components and code you can go back into and change.
GENERATE IMAGERY IN THE CANVAS
Make the picture you need on the canvas, instead of going looking for one.
Code Components and Overrides in Framer
Framer runs on React, so when you hit a limit you can add code. Components for new things, overrides for existing ones.
Using Agents in Framer
The Agent tab sits where the properties panel used to be. Give it context with @, add a skill with /, pick a model, and undo anything it gets wrong.
CURRICULUM
WHAT YOU’LL LEARN IN THIS COURSE
In the Ultimate Framer Masterclass, you’ll master Framer from the ground up. Follow real projects, get expert feedback, and finally design and ship the way you’ve always wanted to.
Prompt Workshop for a component you’d normally skip, then add property controls so you can restyle it from the panel.
08:56
PUBLISH CHECKLIST
Generated a starting layout
Tweaked the output by hand
Built a component with Workshop
Property controls checked
Generated an image
Checked it all on mobile
TRY IT OUT
Cesar Rodrigues
Founder, Craate Creative
FREQUENTLY ASKED QUESTIONS
Everything you need to know about this lesson.
What AI tools does Framer have?
Framer AI isn't one feature. The Agent edits your project, Workshop writes code components, and translation and image tools handle the rest. Each removes a job you'd do by hand.
Will Framer AI design the site for me?
No. It generates real frames, components and code you can go back into and edit. It removes manual work rather than making the design decisions for you.
What is Framer Workshop?
Workshop writes a code component from a description. You get real React plus property controls in the panel, so you can restyle it without editing the code.
CERTIFICATION
BECOME A CERTIFIED FRAMER MASTER
Earn 3 official certifications that show you don’t just know Framer, but you can
design, build, and execute real pixel-perfect sites.
Rated excellent by 900+ students
4.8
Lifetime access
14-day money-back guarantee
Stream anywhere
