Contact Us

If you still have questions or prefer to get help directly from an agent, please submit a request.
We’ll get back to you as soon as possible.

Please fill out the contact form below and we will reply as soon as possible.

  • Contact Us
  • Home
  • Administration – Figma Learn
  • Manage your account
  • Change your preferences

Change themes in Figma

Written by Figma Man

Updated at June 19th, 2025

Contact Us

If you still have questions or prefer to get help directly from an agent, please submit a request.
We’ll get back to you as soon as possible.

Please fill out the contact form below and we will reply as soon as possible.

  • Administration – Figma Learn
    Manage files and projects Manage a team Manage your account Manage a Figma organization Manage Enterprise plan settings and permissions Billing Manage Figma in a school
  • Figma Design – Figma Learn
    Create prototypes Import and export Create designs Tour the interface Dev Mode Work together in files Build design systems Figma Draw
  • Get started – Figma Learn
    Set up your account Layers 101
  • FigJam – Figma Learn
    Import and export Run meetings Work on boards Tour the interface
  • Community – Figma Learn
    Explore the Community Creator tools and resources
  • Help – Figma Learn
    Troubleshoot Common questions Work with support
  • Work across Figma – Figma Learn
    Figma AI Work across Figma
  • Courses, tutorials, projects – Figma Learn
    Courses Projects
  • Figma Slides – Figma Learn
    Create and edit slides Present slide decks Tour the interface Import and export
  • Figma Buzz – Figma Learn
    Templates in Figma Buzz Create and edit assets in Figma Buzz Overview
  • Figma Make – Figma Learn
    Tour the interface Work with Figma Make
  • Figma Sites – Figma Learn
    Design a site Create webpages and breakpoints Make your site interactive Preview and publish a site Tour the interface
+ More

Table of Contents

Change theme Main menu Quick actions

Before you Start

Who can use this feature

Users on any team or plan

Available in Figma Design and file browser

Use themes to change the appearance of Figma Design files and the file browser. Choose between light or dark themes, or let your system settings determine the theme. If your system’s appearance is set to light, then Figma will use the light theme. If your system is set to dark, then Figma will use the dark theme.

Side-by-side comparison of light and dark themes in a Figma Design file

Change theme

Change your theme from a Figma Design file via the main menu or quick actions menu.

Theme settings are device-specific. If you're using a Figma account across multiple devices, theme settings from one device won't carry over to another.

Changing your theme also won’t affect appearance settings for others, even if you’re viewing the same file.

When you create new files, Figma sets the background color to light or dark color depending on your current theme. While in light mode, newly created files default to a light-gray background color #F5F5F5. While in dark mode, they’ll default to an off-black color #1E1E1E.

Note: New pages determine their background color based on the current page’s background color, and don’t rely on your current theme. Change a background color by de-selecting any layers and using the color picker from the Background section of the right sidebar.

Main menu

To change your theme from the main menu of a Figma Design file:

  1. Open any Figma Design file you have access to.
  2. Click in the top-left of the toolbar.
  3. Go to Preferences > Theme.
  4. Select an option from the list of themes.

Your Figma Design file and the file browser will immediately change to the selected theme.

Quick actions

To change your theme from the quick actions menu of a Figma Design file:

  1. Open any Figma Design file you have access to.
  2. Open the quick actions menu.
    • Mac: ⌘ Command /
    • Windows: Control /
  3. Type in search terms to find the theme you want to use
    • Use dark mode
    • Use light mode
    • Use system theme

Your Figma Design file and the file browser will immediately change to the selected theme.

Tip! Plugin developers can match their plugin UI to Figma’s light and dark modes. Learn more from Figma’s plugin developer docs →

Was this article helpful?

Yes
No
Give feedback about this article

Related Articles

  • Choose your browser's downloads folder
  • Open links in the desktop app
  • Manage your notification preferences
  • Manage color profiles in design files
  • Delete your Figma account
  • Blog
  • Best practices
  • QR code generator
  • Color wheel
  • Colors
  • Color picker
  • Color palettes
  • Color palette generator
  • Color contrast checker
  • Font Library
  • Templates
  • Developers
  • Integrations
  • Affiliate program
  • Resource library
  • Reports and insights
  • Support
  • Status
  • Legal and privacy
  • Modern slavery statement
  • Climate disclosure statement
  • COMPARE
  • Sketch
  • Adobe XD
  • Framer
  • Miro
  • COMPANY
  • Events
  • Customers
  • Careers
  • Newsroom
Expand