Created a new dark mode document (#6776)

## What are you changing in this pull request and why?

I have created a new Dark mode document for the rollout of the Dark mode
theme set in the dbt Cloud UI.

I have created a new page, added two images and updated the release
notes to advise users of the new feature

## Checklist
- [x] I have reviewed the [Content style
guide](https://github.com/dbt-labs/docs.getdbt.com/blob/current/contributing/content-style-guide.md)
so my content adheres to these guidelines.
- [ ] The topic I'm writing about is for specific dbt version(s) and I
have versioned it according to the [version a whole
page](https://github.com/dbt-labs/docs.getdbt.com/blob/current/contributing/single-sourcing-content.md#adding-a-new-version)
and/or [version a block of
content](https://github.com/dbt-labs/docs.getdbt.com/blob/current/contributing/single-sourcing-content.md#versioning-blocks-of-content)
guidelines.
- [x] I have added checklist item(s) to this list for anything anything
that needs to happen before this PR is merged, such as "needs technical
review" or "change base branch."
- [x] The content in this PR requires a dbt release note, so I added one
to the [release notes
page](https://docs.getdbt.com/docs/dbt-versions/dbt-cloud-release-notes).
<!--
PRE-RELEASE VERSION OF dbt (if so, uncomment):
- [ ] Add a note to the prerelease version [Migration
Guide](https://github.com/dbt-labs/docs.getdbt.com/tree/current/website/docs/docs/dbt-versions/core-upgrade)
-->
<!-- 
ADDING OR REMOVING PAGES (if so, uncomment):
- [x] Add/remove page in `website/sidebars.js`
- [ ] Provide a unique filename for new pages
- [ ] Add an entry for deleted pages in `website/vercel.json`
- [ ] Run link testing locally with `npm run build` to update the links
that point to deleted pages
-->

<!-- vercel-deployment-preview -->
---
🚀 Deployment available! Here are the direct links to the updated files:


-
https://docs-getdbt-com-git-nfiann-darkmode-dbt-labs.vercel.app/docs/build/metricflow-commands
-
https://docs-getdbt-com-git-nfiann-darkmode-dbt-labs.vercel.app/docs/cloud/about-cloud/dark-mode
-
https://docs-getdbt-com-git-nfiann-darkmode-dbt-labs.vercel.app/docs/dbt-versions/release-notes

<!-- end-vercel-deployment-preview -->

---------

Co-authored-by: Leona B. Campbell <[email protected]>
Co-authored-by: Mirna Wong <[email protected]>

Author: 3 people

website/docs/docs/cloud/about-cloud/dark-mode.md

@@ -0,0 +1,42 @@
+---
+title: "Change your dbt Cloud Theme"
+id: dark-mode
+description: "Learn about theme switching in dbt Cloud"
+sidebar_label: dbt Cloud dark mode
+image: /img/docs/dbt-cloud/using-dbt-cloud/dark-mode.png
+---
+
+dbt Cloud supports **Light mode** (default), **Dark mode**, and **System mode** (respects your browser's theme for light or dark mode) under the **Theme** section of your user profile. You can seamlessly switch between these modes directly from the profile menu, customizing your viewing experience.
+
+Your selected theme is stored in your user profile, ensuring a consistent experience across dbt Cloud.
+
+Theme selection applies across all areas of dbt Cloud, including the [IDE](/docs/cloud/dbt-cloud-ide/develop-in-the-cloud), [dbt Explorer](/docs/collaborate/explore-projects), [environments](/docs/environments-in-dbt), [jobs](/docs/deploy/jobs), and more. Learn more about customizing themes in [Enable dark mode in dbt Cloud](/docs/cloud/about-cloud/dark-mode#enable-dark-mode-in-dbt-cloud).
+
+## Prerequisites
+
+- You have a dbt Cloud account. If you don’t, try [dbt Cloud for free!](https://www.getdbt.com/signup)
+- Dark mode is currently available on the Developer plan and will gradually be made available for all [plans](https://www.getdbt.com/pricing) in the future. Stay tuned for updates.
+
+## Change themes in dbt Cloud
+
+To switch to dark mode in the dbt Cloud UI, follow these steps:
+
+1. Navigate to your account name at the bottom left of your account.
+2. Under **Theme**, select **Dark**.
+
+<Lightbox src="/img/docs/dbt-cloud/using-dbt-cloud/dark-mode.png" width="70%" title="Enable dark mode" />
+
+And that’s it! 🎉 Your chosen selected theme will follow you across all devices.
+
+## Disable dark mode in dbt Cloud
+
+To disable dark mode in the dbt Cloud UI, follow these steps:
+
+1. Navigate to the three dots at the bottom right of the IDE.
+2. Select **Switch to light mode** from the menu.
+
+<Lightbox src="/img/docs/dbt-cloud/using-dbt-cloud/theme-selection-in-the-ide.png" width="90%" title="Enable light mode" />
+
+## Legacy dark mode
+
+The **Switch to dark mode** menu item in the IDE will soon be deprecated. All users who have access to the IDE will default to **Light mode** upon signing in, but can easily switch to **Dark mode** from the user menu in the navigation. Once you switch to your new theme, it will apply to all of your devices.

website/docs/docs/dbt-versions/release-notes.md

@@ -18,6 +18,8 @@ Release notes are grouped by month for both multi-tenant and virtual private clo
 
 ## January 2025
 
+- **New**: Users can now switch themes directly from the user menu. We have added support for **Light mode** (default), **Dark mode**, and automatic theme switching based on system preferences. The selected theme is stored in the user profile and will follow users across all devices.
+  - Dark mode is currently available on the Developer plan and will be available for all [plans](https://www.getdbt.com/pricing) in the future. We’ll be rolling it out gradually, so stay tuned for updates. For more information, refer to [dbt Cloud dark mode](/docs/cloud/about-cloud/dark-mode).
 - **Fix**: Fixed an issue where [saved queries](/docs/build/saved-queries) with no [exports](/docs/build/saved-queries#configure-exports) would fail with an `UnboundLocalError`. Previously, attempting to process a saved query without any exports would cause an error due to an undefined relation variable. Exports are optional, and this fix ensures saved queries without exports don't fail.
 - **New**: You can now query metric alias in dbt Semantic Layer [GraphQL](/docs/dbt-cloud-apis/sl-graphql) and [JDBC](/docs/dbt-cloud-apis/sl-jdbc) APIs. 
   - For the JDBC API, refer to [Query metric alias](/docs/dbt-cloud-apis/sl-jdbc#query-metric-alias) for more information.

website/sidebars.js

@@ -31,6 +31,7 @@ const sidebarSettings = {
         "docs/cloud/about-cloud/tenancy",
         "docs/cloud/about-cloud/access-regions-ip-addresses",
         "docs/cloud/about-cloud/browsers",
+        "docs/cloud/about-cloud/dark-mode",
       ],
     }, // About dbt Cloud directory
     {