Design & Build Notion iOS in Figma
cover-thumbnail
Notion Base Components
Learn to design UI components for the Notion desktop app, mastering Auto Layout, variants, and reusable structures in Figma.

0%

Classes

class-image

Notion: Conducting A Component Audit

06:19

class-image

Notion: Creating Thumbnail Item Component

05:50

class-image

Notion: Designing Buttons

13:10

class-image

Notion: Designing Menu Item Component Set

19:25

class-image

Notion: Creating Auto Layout Navbar Component

10:35

class-image

Notion: Creating Auto Layout Checklist Item Component Set

17:09

class-image

Notion: Creating Auto Layout Task Card Component Set

25:42

class-image

Notion: Creating Auto Layout Underline Tabs Component Set

10:32

class-image

Notion: Creating Auto Layout Task CTAs Component

04:44

class-image

Notion: Designing Auto Layout Tag Component Set

07:25

class-image

Notion: Creating Auto Layout Modal Navbar

08:31

class-image

Notion: Creating Auto Layout Comment Field Component

04:56

Master Designing Notion Components with Auto Layout
This course focuses on practicing the design of key UI components used in the Notion desktop app. Through hands-on exercises, you will recreate avatars items, posts, navbars and other interactive elements while maintaining consistency with Notion's design system.
Course certificate
Notion Base Components
Design & Build Notion iOS in Figma
1

Notion Prototype

topic-thumbnail-Notion UI Styles

Notion UI Styles

3 classes

2

Notion Prototype

topic-thumbnail-Notion Base Components

Notion Base Components

12 classes

3

Notion Prototype

topic-thumbnail-Notion UI Layout

Notion UI Layout

3 classes

4

Notion Prototype

topic-thumbnail-Notion Prototype

Notion Prototype

2 classes

Sign up to start learning
Build UX/UI career skills & confidence for less than $3/week –– cancel anytime
or