Navigate Select ESC Close

Complete Website in Framer: Beginner Tutorial

2023-05-04 Education
189.1k
4.8k
206
Tim Gabe
Tim Gabe
157.0k subscribers

Unlock all features

FREE: Get instant access to 10 AI summaries, chats, or transcripts per day.

Description

In this Framer beginner tutorial we build a responsive and animated website from scratch—in 30 minutes. 🔴 learn about the future of creative work: https://timgabe.com/newsletter 🔴 Working File: https://timgabe.com/resources/framer-complete-website Timestamps 00:35 Styleguide 04:29 Structure 07:05 Design Tweaks 20:07 Responsiveness 26:29 Delightful Animations #figma #figmatutorial ➡️ QUESTION — Have a question about UI, UX or Product Design? Designing in Figma? Or Anything Else? Post in the comments section of this video—I’m happy to answer!

Top Comments (10)

@dandenney3046 2023-05-27

I’m a front-end dev and this blew my mind. It’s the first time I’ve seen a tool that can really do what I do and also do it significantly faster

112 4 replies
@xhongaronga 2023-05-04

I'm only halfway through but I had to pause and comment that this is gold! Was thinking how I could create or use my design system in Framer. This answered it all. And I love how you can use Framer's ready-made sections or components and just tweak them instead of making everthing from scratch. Great tutorial, my dear friend! 💛

30 1 replies
@rbkz714 2023-07-12

I’ve just switched from Wix to Framer today and whilst I was initially VERY overwhelmed and frustrated I am blown away by the functionality of Framer! I’m very thankful to have discovered your channel and I have to say that tutorials such as this are invaluable for people just starting on Framer! The pace you have used and the explanation throughout is absolutely spot on! Thank you bro! 🤜🏼🤛🏼

8 2 replies
@anlcemcavl2726 2023-06-04

I've been looking at framer tutorials for a few weeks and this is really different. It's exciting to discover you.

5
@MrAbbo11 2024-07-15

I've checked a few framer crash course vids so far and yours is by the best in terms of detail and precision as well as providing one with good project setup practice. I can see you approach things in a very systematic way, which is fantastic for a beginner to incorporate from the outset. Thank you!

4
@TimGabe 2025-01-24

if you’re interested in the future of creative work, follow along here: https://timgabe.com/newsletter ❤

1
@vishalmukadam 2025-10-07

One of the best Framer video I have ever watched.

1
@JennieLyra 2024-08-10

so I'm brand new to web design - like I got the idea to do this 10 days ago. Found webflow, I like it, easy to use and they have the "university" but the ability to zoom out to see things in a clipboard style is just amazing.

1
@rajnomadheart 2024-10-24

Thanks, bro, for this video! I've been learning Framer for the last two weeks and have been having a very hard time making my template responsive. Your video is a big help!

1
@jekamartine 2025-12-11

Really love this whole playlist! Thanks for the amazing content 🚀

0

Unlock the Data Inside
Turn Videos into Knowledge

  • Get FREE 10/day: transcripts, summaries, chats
  • Chat with videos, export text & PDF
  • $1 free API credit for RAG, chatbots & research

Free forever plan • All features unlocked

App screenshot