# How Firebase Added Independent Dark and Light Themes to the Firebase Console

DevFeed: [How Firebase Added Independent Dark and Light Themes to the Firebase Console](<https://devfeed.tech/articles/a-console-refresh-with-flexibility-for-night-and-day-16530.md>)

Original publisher: [Read original article](<https://firebase.blog/posts/2023/11/dark-mode>)

Author: Przemek Abratowski; Amanda Ke

Published: 2023-11-13T00:00:00Z

Content type: article

Language: en

Sources: [Firebase Blog](<https://devfeed.tech/sources/firebase-blog.md>)

Topics: [Dark Mode](<https://devfeed.tech/topics/dark-mode.md>), [Firebase](<https://devfeed.tech/topics/firebase.md>), [Accessibility](<https://devfeed.tech/topics/accessibility.md>), [CSS](<https://devfeed.tech/topics/css.md>), [ui](<https://devfeed.tech/topics/ui.md>), [Design system](<https://devfeed.tech/topics/design-system.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [css](<https://devfeed.tech/tags/css.md>), [dark-mode](<https://devfeed.tech/tags/dark-mode.md>), [firebase](<https://devfeed.tech/tags/firebase.md>), [firebase-console](<https://devfeed.tech/tags/firebase-console.md>), [launch](<https://devfeed.tech/tags/launch.md>), [themes](<https://devfeed.tech/tags/themes.md>), [tokens](<https://devfeed.tech/tags/tokens.md>), [ui](<https://devfeed.tech/tags/ui.md>)

## AI overview

Firebase describes the design and implementation of dark mode and a light-theme refresh for the Firebase Console. The article explains why the themes were made independent, how accessibility and legibility shaped the design, and how CSS-variable-based design tokens support the modes.

## Source excerpt

News, tutorials, and updates from the Firebase team.