Components, Variants and Variables

preview_player
Показать описание

In this video we go through the basics of components in Framer, including how to set up variants and how to pass information down using variables.

00:00 Intro
00:13 Basics of components
01:00 Nested components
01:19 Setting up variants
02:24 Adding a hover variant
03:06 Primary variants
04:06 An intro variables
05:43 Outro

#framer #nocode #web #tutorial #beginners
  1. Daniel Hollick
  2. Descript
Рекомендации по теме
Mastering Framer Components 0:19:32

Mastering Framer Components | Variants & Variables

Components, Variants and 0:06:03

Components, Variants and Variables

Variants vs variables 0:15:11

Variants vs variables

Framer Tutorial: Components 0:16:11

Framer Tutorial: Components with Interactions, Variants and Variables

Using variables to 0:02:15

Using variables to change variants

How to use 0:12:18

How to use Figma Variable Modes FIGMA COMPONENT VARIANTS + VARIABLES #figmatutorial #figmacomponents

Figma Button Components 0:22:28

Figma Button Components (Variables, Tokens, Variants & Component Properties ) | Design System Pa...

Connect Figma Variable 0:16:39

Connect Figma Variable to Variant | Connect a component to a variable | Prototype with Variables

Button Library in 0:14:02

Button Library in Figma Using Component, Variants & Variable Modes (PART 2) | Figma Tutorial

Using Figma Variables 0:08:17

Using Figma Variables to Swap Variants Between Modes

Tokens, variables, and 0:13:13

Tokens, variables, and styles - Update: Introduction to design systems

Framer | Components 0:11:10

Framer | Components Variables and Variants - [ Beginner video ]

Master Figma variables 0:07:13

Master Figma variables in 7 minutes

Figma tutorial: Intro 0:14:51

Figma tutorial: Intro to variables

Avatar Component - 0:25:32

Avatar Component - Figma Variables, Variants & Component Properties | Design System Part 9

Intro to Components, 0:06:13

Intro to Components, Variants and Variables in Framer

Figma tutorial: Component 0:18:14

Figma tutorial: Component properties

Figma Component - 0:20:57

Figma Component - Input Field (Variables, Variants & Component Properties ) | Design System Part...

Swapping Variants Using 0:10:10

Swapping Variants Using Variables | A Figma Tutorial

Lesson 5: Styles 0:12:40

Lesson 5: Styles and variables

Backing color styles 0:04:59

Backing color styles with variables

Figma Tips ⚡ 0:08:01

Figma Tips ⚡ - Change variants in prototypes with variables

Design Tip: Use 0:00:19

Design Tip: Use Less Variants with Variables in Figma

Figma Variables & 0:31:01

Figma Variables & Advanced Prototyping - Crash Course

Комментарии
Автор

Awesome tutorial! You really helped me. So helpful and concise! Thanks Daniel

VladTro
Автор

Daniel these introductory videos are super helpful! Thanks

khurramux
Автор

“I hope you found this video helpful.”

YES IT’S VERY HELPFUL, DANIEL!!
tysm for making these videos!

pita___
Автор

Just amazing. How did you find all that info. Does Framer has any documentation?

mishasound