MICRO-COURSE

Design System Foundations

Design System Foundations: 11 short lessons, one for each concept. What a design system is, design principles, design tokens, colour systems, typography scales, spacing and layout grids, iconography, elevation and shadows, motion, theming and dark mode, and accessible foundations.

One focused topic Learn at your pace

Open topic guide Request a session

Learn this micro-course here. Explore the full course whenever you choose.

RECORDED WALKTHROUGHDesign System FoundationsNo recording published yet

01 / WATCH

Recorded video

The recording for this topic is not available yet. You can use the written guide below or request a recorded walkthrough.

Request this recording

02 / UNDERSTAND

Start with the topic guide.

What a design system is, design principles, design tokens, colour systems, typography scales, spacing and layout grids, iconography, elevation and shadows, motion, theming and dark mode, and accessible foundations.

This is a learning outline. A complete worked tutorial has not been published for this topic yet.

Concept scope

03 / TRY IT

Prepare a focused example

Choose one question about Design System Foundations that you want to answer.
Write down a small example, its inputs or starting point, and the result you expect.
Explain your reasoning and note what you would like reviewed in a live or 1:1 session.

Keep your work

A short example, reasoning and an open question

Check your understanding

Explain the concept in your own words and identify where it fits in the subject.
Show one small example, the expected result and the reasoning behind it.
Record one limitation or edge case and a question to discuss with a mentor.

04 / LEARN WITH HELP

Need a walkthrough?
Stay with this topic.

Request a live session or focused one-to-one guidance on Design System Foundations. Bring your questions, a practice attempt or a specific blocker.

Your request stays specific to this micro-course.
Share your preferred schedule in the form.
Availability, timing and fees are confirmed before booking.

Prefer a quick chat?Ask on WhatsApp

CONTINUE WITH ONE CONCEPT

Explore 11 focused topics.

Each topic opens its own micro-course, with its learning guide, recording status and session requests.

11 results1–11

Lesson

What a design system is

A short lesson on what a design system is from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Design principles

A short lesson on design principles from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Design tokens

A short lesson on design tokens from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Colour systems

A short lesson on colour systems from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Typography scales

A short lesson on typography scales from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Spacing and layout grids

A short lesson on spacing and layout grids from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Iconography

A short lesson on iconography from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Elevation and shadows

A short lesson on elevation and shadows from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Motion

A short lesson on motion from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Theming and dark mode

A short lesson on theming and dark mode from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Lesson

Accessible foundations

A short lesson on accessible foundations from the Design System Foundations micro course: what it is, where it shows up in real systems, and a practical example you can apply.

Open lesson

Design System Foundations

Recorded video

Start with the topic guide.

Concept scope

Prepare a focused example

Check your understanding

Need a walkthrough?Stay with this topic.

Request a live session for this topic.

Explore 11 focused topics.

What a design system is

Design principles

Design tokens

Colour systems

Typography scales

Spacing and layout grids

Iconography

Elevation and shadows

Motion

Theming and dark mode

Accessible foundations

Need a walkthrough?
Stay with this topic.