Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Play

Play

Play

Play

Lessons

Lessons

Lessons

Videos that take you from noob to pro.

Videos that take you from noob to pro.

Videos that take you from noob to pro.

Videos that take you from noob to pro.

  • CMS features in Framer explained with expert insights

    Framer CMS: Explained

    In this Framer tutorial, I teach you the basics of the Framer CMS. We're going to be covering what a CMS is, how it works, how we can create flexible detail pages for our collection items, and how to create a filtering system. After watching this video, you're going to have the necessary knowledge for setting up your own CMS collections in Framer.

    CMS features in Framer explained with expert insights

    Framer CMS: Explained

    In this Framer tutorial, I teach you the basics of the Framer CMS. We're going to be covering what a CMS is, how it works, how we can create flexible detail pages for our collection items, and how to create a filtering system. After watching this video, you're going to have the necessary knowledge for setting up your own CMS collections in Framer.

    CMS features in Framer explained with expert insights

    Framer CMS: Explained

    In this Framer tutorial, I teach you the basics of the Framer CMS. We're going to be covering what a CMS is, how it works, how we can create flexible detail pages for our collection items, and how to create a filtering system. After watching this video, you're going to have the necessary knowledge for setting up your own CMS collections in Framer.

  • Framer website homepage showcasing no-code web design platform with floating mobile app mockups and 'Start building' call-to-action against dark background

    Framer Tutorial: Building A Site From Scratch

    Let's create an animated, responsive website in Framer, starting from a blank canvas. Learn topics like different positioning types, responsive structures, components, 3D transforms, animations, and more. By the end of the video, you'll have all the skills needed to build websites with Framer.

    Framer website homepage showcasing no-code web design platform with floating mobile app mockups and 'Start building' call-to-action against dark background

    Framer Tutorial: Building A Site From Scratch

    Let's create an animated, responsive website in Framer, starting from a blank canvas. Learn topics like different positioning types, responsive structures, components, 3D transforms, animations, and more. By the end of the video, you'll have all the skills needed to build websites with Framer.

    Framer website homepage showcasing no-code web design platform with floating mobile app mockups and 'Start building' call-to-action against dark background

    Framer Tutorial: Building A Site From Scratch

    Let's create an animated, responsive website in Framer, starting from a blank canvas. Learn topics like different positioning types, responsive structures, components, 3D transforms, animations, and more. By the end of the video, you'll have all the skills needed to build websites with Framer.

  • Framer Masterclass: Learn Components in 30 Minutes

    Framer Masterclass: Learn Components in 30 Minutes

    In this Framer tutorial, you'll master the art of creating and using components. You'll learn how to build interactive elements, optimize for different breakpoints, and utilize variants, variables, and event variables. I'll guide you through creating a toggle switch, customizing resource cards, and setting up complex interactions. With these skills, you'll be able to design dynamic menus, responsive layouts, and reusable elements that will elevate your Framer projects to the next level.

    Framer Masterclass: Learn Components in 30 Minutes

    Framer Masterclass: Learn Components in 30 Minutes

    In this Framer tutorial, you'll master the art of creating and using components. You'll learn how to build interactive elements, optimize for different breakpoints, and utilize variants, variables, and event variables. I'll guide you through creating a toggle switch, customizing resource cards, and setting up complex interactions. With these skills, you'll be able to design dynamic menus, responsive layouts, and reusable elements that will elevate your Framer projects to the next level.

    Framer Masterclass: Learn Components in 30 Minutes

    Framer Masterclass: Learn Components in 30 Minutes

    In this Framer tutorial, you'll master the art of creating and using components. You'll learn how to build interactive elements, optimize for different breakpoints, and utilize variants, variables, and event variables. I'll guide you through creating a toggle switch, customizing resource cards, and setting up complex interactions. With these skills, you'll be able to design dynamic menus, responsive layouts, and reusable elements that will elevate your Framer projects to the next level.

  • The only video you need to learn Framer scroll animations...

    The only video you need to learn Framer scroll animations...

    Learn how to create stunning scroll animations without code. I'll guide you through recreating the Tedy website's scroll animation, showing you tactics to build complex animations using Framer. You'll discover how to set up sticky positioning, plan your animation timeline, and execute the animation using Framer's scroll transform effect.

    The only video you need to learn Framer scroll animations...

    The only video you need to learn Framer scroll animations...

    Learn how to create stunning scroll animations without code. I'll guide you through recreating the Tedy website's scroll animation, showing you tactics to build complex animations using Framer. You'll discover how to set up sticky positioning, plan your animation timeline, and execute the animation using Framer's scroll transform effect.

    The only video you need to learn Framer scroll animations...

    The only video you need to learn Framer scroll animations...

    Learn how to create stunning scroll animations without code. I'll guide you through recreating the Tedy website's scroll animation, showing you tactics to build complex animations using Framer. You'll discover how to set up sticky positioning, plan your animation timeline, and execute the animation using Framer's scroll transform effect.

  • Framer SEO for Beginners: Rank #1 In Google

    Framer SEO for Beginners: Rank #1 In Google

    Learn how to optimize your websites for search engines in Framer. I'll show you all the tips and tricks you can use inside Framer to achieve great SEO. I'll also share some additional techniques that help maximize your chances of showing up in Google search results.

    Framer SEO for Beginners: Rank #1 In Google

    Framer SEO for Beginners: Rank #1 In Google

    Learn how to optimize your websites for search engines in Framer. I'll show you all the tips and tricks you can use inside Framer to achieve great SEO. I'll also share some additional techniques that help maximize your chances of showing up in Google search results.

    Framer SEO for Beginners: Rank #1 In Google

    Framer SEO for Beginners: Rank #1 In Google

    Learn how to optimize your websites for search engines in Framer. I'll show you all the tips and tricks you can use inside Framer to achieve great SEO. I'll also share some additional techniques that help maximize your chances of showing up in Google search results.

  • Framer for Beginners: Responsive Navbar From Scratch

    Framer for Beginners: Responsive Navbar From Scratch

    Learn how to build a fully responsive navigation bar. You'll discover how to use components and variants in Framer, along with interactions, to make elements responsive on your site.

    Framer for Beginners: Responsive Navbar From Scratch

    Framer for Beginners: Responsive Navbar From Scratch

    Learn how to build a fully responsive navigation bar. You'll discover how to use components and variants in Framer, along with interactions, to make elements responsive on your site.

    Framer for Beginners: Responsive Navbar From Scratch

    Framer for Beginners: Responsive Navbar From Scratch

    Learn how to build a fully responsive navigation bar. You'll discover how to use components and variants in Framer, along with interactions, to make elements responsive on your site.

  • Framer for Beginners: Avoid the #1 Rookie Mistake

    Framer for Beginners: Avoid the #1 Rookie Mistake

    Learn how to avoid the biggest mistake every beginner makes in Framer. I'll teach you the basics of responsiveness and show you how to set up your page structure. This way, you can effortlessly optimize the website for multiple breakpoints later.

    Framer for Beginners: Avoid the #1 Rookie Mistake

    Framer for Beginners: Avoid the #1 Rookie Mistake

    Learn how to avoid the biggest mistake every beginner makes in Framer. I'll teach you the basics of responsiveness and show you how to set up your page structure. This way, you can effortlessly optimize the website for multiple breakpoints later.

    Framer for Beginners: Avoid the #1 Rookie Mistake

    Framer for Beginners: Avoid the #1 Rookie Mistake

    Learn how to avoid the biggest mistake every beginner makes in Framer. I'll teach you the basics of responsiveness and show you how to set up your page structure. This way, you can effortlessly optimize the website for multiple breakpoints later.

  • Framer Tutorial: Turn Your Website Into A Digital Store

    Framer Tutorial: Turn Your Website Into A Digital Store

    Learn how to turn your Framer website into a digital store. I'll show you how to create a "Buy" button and how to trigger a checkout experience to it. After watching this video, you'll be ready to launch an online shop without any code.

    Framer Tutorial: Turn Your Website Into A Digital Store

    Framer Tutorial: Turn Your Website Into A Digital Store

    Learn how to turn your Framer website into a digital store. I'll show you how to create a "Buy" button and how to trigger a checkout experience to it. After watching this video, you'll be ready to launch an online shop without any code.

    Framer Tutorial: Turn Your Website Into A Digital Store

    Framer Tutorial: Turn Your Website Into A Digital Store

    Learn how to turn your Framer website into a digital store. I'll show you how to create a "Buy" button and how to trigger a checkout experience to it. After watching this video, you'll be ready to launch an online shop without any code.

Resources

Resources

Resources

Must-have components for your projects.

Must-have components for your projects.

Must-have components for your projects.

Must-have components for your projects.

  • Subtle text shimmer effect for dynamic visual emphasis

    Text Shimmer Component for Framer

    This is a fully customizable shimmer text component for Framer. You can tweak the text and shimmer colors, size, speed and delay to fit your style—perfect for adding a bit of visual interest to headers or callouts. Feel free to grab the component, adjust the settings, and experiment with it on your projects.

    Subtle text shimmer effect for dynamic visual emphasis

    Text Shimmer Component for Framer

    This is a fully customizable shimmer text component for Framer. You can tweak the text and shimmer colors, size, speed and delay to fit your style—perfect for adding a bit of visual interest to headers or callouts. Feel free to grab the component, adjust the settings, and experiment with it on your projects.

    Subtle text shimmer effect for dynamic visual emphasis

    Text Shimmer Component for Framer

    This is a fully customizable shimmer text component for Framer. You can tweak the text and shimmer colors, size, speed and delay to fit your style—perfect for adding a bit of visual interest to headers or callouts. Feel free to grab the component, adjust the settings, and experiment with it on your projects.

  • Laptop showcasing scroll animations

    Scroll Media Component in Framer

    This is a versatile scroll media component for Framer that brings your websites to life by playing image sequences or videos as visitors scroll down. Just drop it into your project, tweak the properties to your liking, and watch your scroll animations come to life.

    Laptop showcasing scroll animations

    Scroll Media Component in Framer

    This is a versatile scroll media component for Framer that brings your websites to life by playing image sequences or videos as visitors scroll down. Just drop it into your project, tweak the properties to your liking, and watch your scroll animations come to life.

    Laptop showcasing scroll animations

    Scroll Media Component in Framer

    This is a versatile scroll media component for Framer that brings your websites to life by playing image sequences or videos as visitors scroll down. Just drop it into your project, tweak the properties to your liking, and watch your scroll animations come to life.

  • Infinite scrolling ticker component for Framer with customizable direction and speed

    Ticker Scroll Component for Framer

    This is a ticker scroll component that lets you create infinite scrolling animation in Framer. Just connect your frames to the component, set your scroll direction and speed, and watch as your content flows endlessly across the screen.

    Infinite scrolling ticker component for Framer with customizable direction and speed

    Ticker Scroll Component for Framer

    This is a ticker scroll component that lets you create infinite scrolling animation in Framer. Just connect your frames to the component, set your scroll direction and speed, and watch as your content flows endlessly across the screen.

    Infinite scrolling ticker component for Framer with customizable direction and speed

    Ticker Scroll Component for Framer

    This is a ticker scroll component that lets you create infinite scrolling animation in Framer. Just connect your frames to the component, set your scroll direction and speed, and watch as your content flows endlessly across the screen.

  • SVG Component for Framer

    SVG Component for Framer

    This is an SVG component in Framer that makes using icons much easier. Just paste in the SVG code of the icon, and it appears on the page. Customize the color and other properties in the right panel easily. Feel free to copy the component to your website and start using it.

    SVG Component for Framer

    SVG Component for Framer

    This is an SVG component in Framer that makes using icons much easier. Just paste in the SVG code of the icon, and it appears on the page. Customize the color and other properties in the right panel easily. Feel free to copy the component to your website and start using it.

    SVG Component for Framer

    SVG Component for Framer

    This is an SVG component in Framer that makes using icons much easier. Just paste in the SVG code of the icon, and it appears on the page. Customize the color and other properties in the right panel easily. Feel free to copy the component to your website and start using it.

  • Hover Chroma Backgrounds in Framer

    Hover Chroma Backgrounds in Framer

    This is a Framer component that adds an interactive chroma background to your website. It's inspired by the Raycast and Lusion websites. Feel free to copy the component to your project and customize it using the properties in the right panel.

    Hover Chroma Backgrounds in Framer

    Hover Chroma Backgrounds in Framer

    This is a Framer component that adds an interactive chroma background to your website. It's inspired by the Raycast and Lusion websites. Feel free to copy the component to your project and customize it using the properties in the right panel.

    Hover Chroma Backgrounds in Framer

    Hover Chroma Backgrounds in Framer

    This is a Framer component that adds an interactive chroma background to your website. It's inspired by the Raycast and Lusion websites. Feel free to copy the component to your project and customize it using the properties in the right panel.

  • Comments Section Component for Framer

    Comments Section Component for Framer

    This is a comments section component for your Framer website. It's super easy to implement and you won't have to touch a single line of code. If you have a blog section and want to add comments under each of your posts, this is for you.

    Comments Section Component for Framer

    Comments Section Component for Framer

    This is a comments section component for your Framer website. It's super easy to implement and you won't have to touch a single line of code. If you have a blog section and want to add comments under each of your posts, this is for you.

    Comments Section Component for Framer

    Comments Section Component for Framer

    This is a comments section component for your Framer website. It's super easy to implement and you won't have to touch a single line of code. If you have a blog section and want to add comments under each of your posts, this is for you.

  • 3D Book Component for Framer

    3D Book Component for Framer

    This is an interactive 3D book component for Framer. You can simply copy and paste it into your project, then customize it using the component properties. It's really easy!

    3D Book Component for Framer

    3D Book Component for Framer

    This is an interactive 3D book component for Framer. You can simply copy and paste it into your project, then customize it using the component properties. It's really easy!

    3D Book Component for Framer

    3D Book Component for Framer

    This is an interactive 3D book component for Framer. You can simply copy and paste it into your project, then customize it using the component properties. It's really easy!

  • Led Matrix Component for Framer

    LED Matrix Component for Framer

    This is a fully customizable LED Matrix component for Framer. It uses the <canvas> element to render squares and alter colors according to your preferences. Feel free to copy and paste this component into your project and start experimenting.

    Led Matrix Component for Framer

    LED Matrix Component for Framer

    This is a fully customizable LED Matrix component for Framer. It uses the <canvas> element to render squares and alter colors according to your preferences. Feel free to copy and paste this component into your project and start experimenting.

    Led Matrix Component for Framer

    LED Matrix Component for Framer

    This is a fully customizable LED Matrix component for Framer. It uses the <canvas> element to render squares and alter colors according to your preferences. Feel free to copy and paste this component into your project and start experimenting.

  • Smooth Scroll Effect in Framer

    Smooth Scroll Effect in Framer

    This is a smooth scrolling effect for Framer, which uses Lenis under the hood. Feel free to copy the component to your clipboard and paste it into your site to start using it.

    Smooth Scroll Effect in Framer

    Smooth Scroll Effect in Framer

    This is a smooth scrolling effect for Framer, which uses Lenis under the hood. Feel free to copy the component to your clipboard and paste it into your site to start using it.

    Smooth Scroll Effect in Framer

    Smooth Scroll Effect in Framer

    This is a smooth scrolling effect for Framer, which uses Lenis under the hood. Feel free to copy the component to your clipboard and paste it into your site to start using it.

  • Blur Gradient Component for Framer

    Blur Gradient Component

    This is a blur gradient component for Framer that you can just easily drag and drop onto your canvas. Place it over any element to add a progressive blur effect to it.

    Blur Gradient Component for Framer

    Blur Gradient Component

    This is a blur gradient component for Framer that you can just easily drag and drop onto your canvas. Place it over any element to add a progressive blur effect to it.

    Blur Gradient Component for Framer

    Blur Gradient Component

    This is a blur gradient component for Framer that you can just easily drag and drop onto your canvas. Place it over any element to add a progressive blur effect to it.

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait