This lesson was released before Agents, Branching, and the CMS update on June 16, 2026. Some UI may differ, but the core concepts still apply.

Creating light and dark themes in Framer

Color styles in Framer have a major trick up their sleeve: the ability to split them between themes for light and dark mode.

Color styles in Framer have a major trick up their sleeve: the ability to split them between themes for light and dark mode.

In this Framer tutorial, you will learn Creating light and dark themes in Framer. We explain a practical workflow, highlight the key settings that affect the result, and show how to apply the technique on real pages for cleaner UX and better site performance. See Light and Dark Mode.

Lesson details

Apr 5, 2025

6:30

Framer Fundamentals

Remix Project

Continue course

The Framer interface

5:16

The anatomy of a project

5:38

Interacting with layers

6:01

Thinking in frames

3:53

Absolute positioning

7:39

Related videos

Academy