The setting is called Theme, and it sits under Preferences in Figma’s main menu. Switch it to Dark and the toolbar, the panels, and the dashboard all repaint. Your files stay exactly as you drew them.
It’s a per-device choice inside your account. It covers Figma Design files along with the dashboard’s file browser, and you get Light, Dark, or System.
One gap worth knowing about before you go hunting for it: Figma’s community forum confirmed in March 2026 that FigJam still lacks a full dark mode. Figma Design has had the setting since May 2022.
What Is Dark Mode in Figma
Think of it as a display preference, not a design feature. The app’s own chrome picks up a dark color scheme instead of the default light one, and that’s the entire scope of it.
Whatever colors live inside your files stay untouched.
Figma shipped the feature on May 10, 2022, after years of requests on its own community forum (Figma Community, 2022). Blank files pick up a background that matches whichever theme you’re in: #F5F5F5 under light, #1E1E1E under dark (Figma Help Center).
What Each Option Actually Does
Light is the original white-and-gray interface, still what new accounts open with.
Dark runs close to black. Built for dim rooms and long evening sessions.
System hands the decision over to the operating system. Figma follows whatever appearance mode macOS or Windows is currently running, which means your theme can change without you touching Figma at all. There’s no fourth option tucked away in a submenu.
What the Setting Changes and What It Doesn’t
The theme only touches Figma’s own chrome. It leaves the content you’re designing completely alone.
Have you seen the latest Figma statistics?
Discover comprehensive Figma statistics including revenue growth, market share, user demographics, and funding data.
Check them out →| Area | Affected by theme |
|---|---|
| Toolbar, panels, dashboard | Yes, repaints instantly |
| Canvas and layer colors | No, artwork stays exactly as drawn |
| File browser | Yes, matches the current theme |
A mockup built entirely in white stays white in dark mode. Only the frame around it goes dark.
Figma Dark Mode vs Dark Mode for Your Designs
Figma reuses the words “theme” and “mode” across several unrelated features, and that’s where most of the confusion starts. The interface toggle has nothing to do with building light and dark versions of an actual design.
| Feature | What it controls | Where it lives |
|---|---|---|
| Theme setting | App interface color | Preferences menu |
| Variable modes | Color values inside a design | Variables panel |
| Slides “Theme” | A deck’s saved colors and styles | Figma Slides API |
Building those design-side modes is a separate job from switching the app’s appearance, and there’s a full walkthrough in this Figma variables guide.
Shadcn Figma Kit’s 2.0 release in March 2026 shipped a two-layer variable setup built specifically for swapping between light and dark component themes, which is a decent look at how design-side modes get used in practice.
Variable modes also carry plan limits. The interface theme doesn’t.
Figma raised those limits in October 2025. Professional plans moved from 4 to 10 modes per collection and Organization plans went from 4 to 20, while Enterprise stayed capped at 40 (Figma Community team, 2025).
If you’re weighing whether Variables justify an upgrade, the exact Figma free vs professional breakdown is worth reading before you build a design system around them.
There’s also a separate AI dark mode converter in Figma that repaints an existing design’s colors on request. That one runs in the opposite direction from the interface toggle.
Dev Mode is another “mode” worth ruling out while we’re here. It changes what panel developers see, not the color of anything around it.
Light, Dark, or System: Which Theme Should You Use in Figma
No wrong answer. It mostly comes down to whether you want the theme to hold still.
Light stays put regardless of what your OS is doing, and it matches most tutorial screenshots and older documentation, which is genuinely useful when you’re following along with someone else’s steps. Thin gray icons read more easily against it for some people.
Dark cuts glare during evening work. It’s also fixed no matter what the OS is set to, which makes it a safe pick for screen recordings. Fine gray-on-black text can be harder to scan for a few people, and that varies more between individuals than you’d expect.
System is the low-maintenance option. One less setting to remember across a busy week. The catch is that it can repaint mid-session if your OS flips on its own schedule, and that’s an awkward thing to have happen halfway through a screen share.
Anyone recording tutorials or presenting to clients tends to lock it to a fixed theme for that reason.
How to Turn On Dark Mode in Figma
Both routes land on the same short list of options, and either takes a few seconds.
Main Menu Method
The click-through route behaves identically in the desktop app and in the browser.
- Open any Figma Design file you have access to
- Click the Figma icon in the top-left corner of the toolbar
- Go to Preferences, then Theme
- Select Dark from the list
The interface and the file browser repaint immediately, with no reload needed.
Quick Actions Method
Hit Cmd + / on a Mac, or Ctrl + / on Windows. Type “dark mode” and select Use dark mode from the results.
Faster once you’ve done it a couple of times, and it skips the nested Preferences submenu entirely.
Worth bookmarking a full list of these, and this Figma keyboard shortcuts reference covers the rest of the ones worth memorizing.
How to Switch Figma Back to Light Mode
Same two paths, opposite selection.
- Open the main menu (Figma icon, then Preferences, then Theme) and choose Light
- Or open quick actions with Cmd + / or Ctrl + /, type “light mode,” and select Use light mode
Picking System instead of Light is worth a thought here, since it saves you from flipping the switch manually from now on.
Does Changing Your Theme Affect Other Devices or Collaborators
No on both counts, and this trips people up more than almost anything else about the setting.
Theme settings are stored per device rather than per account, so going dark on a work laptop won’t carry over to a home desktop. You’ll set it again there.
Switching your own theme inside a shared file has zero effect on what teammates see. Each person’s Figma instance renders its own chosen theme independently, even inside the same live multiplayer session.
That per-device behavior comes up constantly on Figma’s own community forum, where users have asked for a synced or per-file option that doesn’t currently exist.
Is Dark Mode Available in FigJam, Figma Slides, and the Figma Mobile App
Coverage is uneven across Figma’s product lineup, and the official documentation only names two surfaces outright.
| Product | Dark mode support | Notes |
|---|---|---|
| Figma Design | Full support | Main menu or quick actions |
| Dashboard / file browser | Full support | Matches your device theme |
| FigJam | Not supported | Confirmed on Figma’s community forum, March 2026 |
| Figma Slides | Not named in official scope | Its own “Theme” means deck styling, not app color |
Figma’s help documentation scopes the setting to Figma Design files and the file browser, which leaves FigJam and Slides sitting outside that stated coverage.
Figma Mirror, the companion app for iOS and Android that shows prototypes on a phone, is its own product with its own appearance behavior. It isn’t an extension of the Design app’s theme setting.
So if a FigJam whiteboard session looks stuck in light mode, that’s expected right now. Nothing broken on your end.
When Figma’s Dark Mode Does Not Work
Most reports of dark mode “not working” aren’t broken accounts at all. They trace back to a handful of specific causes, each with its own fix, and none of them need a support ticket.
The Theme Not Sticking Between Sessions
A fresh browser profile or an incognito window has no stored preference yet, so it opens in Light even though your regular window is set to Dark.
Clearing cookies does the same thing, as does switching to a new work profile, because the setting lives with that specific browser instance rather than with your Figma account.
Reapply the theme once inside the new profile and it’ll hold, through either the main menu or the quick actions shortcut.
Places That Don’t Have the Setting at All
Figma’s own community forum and Help Center run in permanent light mode.
A Figma support team member confirmed in November 2023 that dark mode is not offered for the forum, despite repeated requests, and logged the request internally without a timeline (Figma Community, 2023).
If some Figma surface still looks light after you’ve switched everything else, check whether it’s just one of these unsupported pages.
Browser Extensions Fighting the Native Setting
Plenty of people used extensions like Dark Reader to force a dark theme onto Figma before the native option existed, and a few are still running one on top of it.
Community reports on extension-forced dark mode describe a consistent set of problems:
- Color accuracy breaks, which matters if you’re checking hex values on screen
- Note and card colors invert or wash out instead of rendering correctly
- The extension conflicts with other installed extensions, or breaks after a product update
- Real-time collaboration takes a noticeable performance hit
Figma’s community forum documents this exact pattern among users troubleshooting it (Figma Community, 2025).
Easiest fix is turning the extension off for figma.com and letting the native theme setting do its job.
Variable Mode Failures That Look Like Theme Bugs
A June 2025 report described Figma no longer recognizing which mode column a component sat in, so dark-mode alias colors stopped applying even though the same setup had worked days earlier. Figma support acknowledged the regression and escalated it for further investigation the following month (Figma Community, 2025).
Then there’s a separate, longer-running set of reports about components that render correctly in dark mode on the canvas but revert to their light-mode colors once a prototype is presented. Figma’s community forum shows this reported as early as 2023, with users still flagging it as unresolved in October 2024 (Figma Community, 2023-2024).
Both problems sit inside the Variables system rather than the interface theme, so switching Light, Dark, or System in Preferences won’t move either one.
FAQ on How To Change Figma To Dark Mode
Why do new Figma files start with a different background color in light versus dark mode?
A new file’s default canvas background is set to match the current interface theme.
Light theme files default to #F5F5F5, dark theme files default to #1E1E1E, which keeps a blank canvas from clashing with the toolbar and panels around it.
Is Figma’s dark mode a free feature, or limited to paid plans?
Free. Figma’s help documentation lists the theme setting as available to users on any team or plan, free tier included.
Variables modes work differently. Those are plan-limited, and more than one mode requires Professional or higher.
Do exported images and PDFs change when you switch Figma’s theme?
No. The theme setting only repaints Figma’s own interface, never the canvas.
Artwork keeps its original colors regardless of theme, so anything you export as an image, PDF, or code comes out identical in Light, Dark, or System mode.
What Should You Prioritize When Setting Up How To Change Figma To Dark Mode for a Whole Team?
Rolling dark mode out across a team starts with each person switching their own device, because Figma stores the Theme choice locally instead of pushing one setting to everyone’s account.
In practice, that means going device by device, then confirming your Variables mode limits actually cover the team’s design tokens, then telling people that FigJam and Slides are going to stay light so nobody files a bug about it.
No admin toggle pushes the choice to a whole workspace at once. Accepting Figma dark mode for a team means repeating the same two-click switch on every person’s device rather than leaning on one central setting.
Teams that want the same light and dark contrast standardized inside components, not just the interface, take that work into building a design system in Figma, which is the step that follows once individual theme preferences are sorted.
