Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

freeCodeCamp

Create a Design System with Figma - Full Course

via freeCodeCamp

Start learning Write review
Coursera Ad

Learn AI, Data Science & Business — Earn Certificates That Get You Hired

Learn More → DataCamp Ad

Power BI Fundamentals - Create visualizations and dashboards from scratch

Learn More →

Overview

Google, IBM & Meta Certificates – 40% Off
One Coursera Plus subscription covers most Professional Certificates on Coursera.
Unlock All Certificates
Full-length video course on building a complete design system in Figma. It covers the foundations — color systems, type systems, elevation, product and system icons, text legibility, states and selection, layout, pixel density, spacing methods and responsive grids — and then constructs core UI components including top and bottom app bars, backdrops, banners, bottom navigation, floating action buttons and standard buttons, cards, chips, dialogs, date pickers and dividers. Aimed at designers and developers who want a structured, reusable component library for digital products.

Syllabus

Introduction.
Creating a Color System.
Building a Type System in Figma.
Elevation.
Product & System Icons.
Text Legibility.
States.
Selection (Interaction).
Understanding Layout.
Pixel Density.
Spacing Methods.
Responsive Grid Layout.
App Bar - Bottom.
App Bar - Top.
Backdrop.
Banners.
Bottom Navigation.
Buttons - Floating Action Button.
Buttons.
Cards.
Chips.
Dialogs.
Date Pickers.
Dividers.

Taught by

freeCodeCamp.org

Reviews

4.5 rating, based on 2 Class Central reviews

Start your review of Create a Design System with Figma - Full Course

  • Profile image for Sathwik Kumar
    Sathwik Kumar
    nice i understood it very good thank you i am very happy to see this vedio so i request every one to watch this video so thank you free code camp for this superb explanination i also done html course i free code camp i am very happy
  • Profile image for Ajay Raman
    Ajay Raman
    At first i thought, this is boring.
    But it's compulsory to learn the Design System because you need to follow the guidelines to design a Web or Mobile application.
    It's good and informative.
Start learning

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.