---
title: "Introducing dark mode 🌑"
description: "We are pleased to announce dark mode for Cloudsmith’s new web application. Dark mode is an essential feature for modern web applications, and has been a frequent customer request since the new web app was released in Early Access."
canonical_url: "https://cloudsmith.com/changelog/introducing-dark-mode"
last_updated: "2025-03-13T12:00:00.000Z"
---
# Introducing dark mode 🌑

We are pleased to announce dark mode for Cloudsmith’s new web application. Dark mode is an essential feature for modern web applications, and has been a frequent customer request since [the new web app was released in Early Access]().

```json
{
  "_key": "c4aefa34f541",
  "_type": "image",
  "asset": {
    "_createdAt": "2025-05-24T05:40:04Z",
    "_id": "image-229cdc2b6140fabb35bff74fc1e93203d66cb2d9-2000x1499-webp",
    "_rev": "NWScFYp63iLSvMKsVgdGGw",
    "_type": "sanity.imageAsset",
    "_updatedAt": "2025-05-24T05:40:04Z",
    "assetId": "229cdc2b6140fabb35bff74fc1e93203d66cb2d9",
    "extension": "webp",
    "metadata": {
      "_type": "sanity.imageMetadata",
      "blurHash": "V03Ikw-r-:nMIU9FIpR4xUx]_N%Mx]ITNG9EMxW?x]xu",
      "dimensions": {
        "_type": "sanity.imageDimensions",
        "aspectRatio": 1.33422281521014,
        "height": 1499,
        "width": 2000
      },
      "hasAlpha": false,
      "isOpaque": true,
      "lqip": "data:image/jpeg;base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAPABQDASIAAhEBAxEB/8QAGAAAAgMAAAAAAAAAAAAAAAAAAAMBAgj/xAAiEAACAQMDBQEAAAAAAAAAAAABAgADERIUITEEE1FhcXL/xAAXAQADAQAAAAAAAAAAAAAAAAAAAQID/8QAGBEBAAMBAAAAAAAAAAAAAAAAAAERYRL/2gAMAwEAAhEDEQA/AM7Bx3DmhYeJU2LDFberx+kqs74ndEzPyI6dcqoHJmuI1BquhstwObQjtJUckhdv1CFSXUP/2Q==",
      "palette": {
        "_type": "sanity.imagePalette",
        "darkMuted": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#3e3460",
          "foreground": "#fff",
          "population": 0.01,
          "title": "#fff"
        },
        "darkVibrant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#070c40",
          "foreground": "#fff",
          "population": 0.01,
          "title": "#fff"
        },
        "dominant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#a5a8af",
          "foreground": "#000",
          "population": 0.36,
          "title": "#fff"
        },
        "lightMuted": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#a5a8af",
          "foreground": "#000",
          "population": 0.36,
          "title": "#fff"
        },
        "lightVibrant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#edf2f8",
          "foreground": "#000",
          "population": 0.18,
          "title": "#000"
        },
        "muted": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#667e95",
          "foreground": "#fff",
          "population": 0.03,
          "title": "#fff"
        },
        "vibrant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#9a6e44",
          "foreground": "#fff",
          "population": 0.03,
          "title": "#fff"
        }
      }
    },
    "mimeType": "image/webp",
    "originalFilename": "dark-mode-1.webp",
    "path": "images/rafvlnhi/production/229cdc2b6140fabb35bff74fc1e93203d66cb2d9-2000x1499.webp",
    "sha1hash": "229cdc2b6140fabb35bff74fc1e93203d66cb2d9",
    "size": 152404,
    "uploadId": "xcXMY6vnU7p6cxCMVUQOJzeaDBOcCzgv",
    "url": "https://cdn.sanity.io/images/rafvlnhi/production/229cdc2b6140fabb35bff74fc1e93203d66cb2d9-2000x1499.webp"
  },
  "link": null,
  "markDefs": null
}
```

#### Enabling dark mode

The theme toggle for enabling dark mode is located in the footer of the web application, and in your Account Settings.

```json
{
  "_key": "550da026d420",
  "_type": "image",
  "asset": {
    "_createdAt": "2025-05-24T05:40:45Z",
    "_id": "image-d55abb8dbfc6b9b6ce3dae080bd8e9adae462fa5-2000x1499-webp",
    "_rev": "CGM1o0zrCuXLQjyAEixLy8",
    "_type": "sanity.imageAsset",
    "_updatedAt": "2025-05-24T05:40:45Z",
    "assetId": "d55abb8dbfc6b9b6ce3dae080bd8e9adae462fa5",
    "extension": "webp",
    "metadata": {
      "_type": "sanity.imageMetadata",
      "blurHash": "V02Yw|tWRf%MM}M}xZRibws8-=IUt8t6IVIpxtRjX9s,",
      "dimensions": {
        "_type": "sanity.imageDimensions",
        "aspectRatio": 1.33422281521014,
        "height": 1499,
        "width": 2000
      },
      "hasAlpha": false,
      "isOpaque": true,
      "lqip": "data:image/jpeg;base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAPABQDASIAAhEBAxEB/8QAGAAAAgMAAAAAAAAAAAAAAAAAAAMCBQj/xAAgEAEAAgECBwAAAAAAAAAAAAABAAIxAxEEEhMhMlFh/8QAFwEAAwEAAAAAAAAAAAAAAAAAAQIDBP/EABcRAQEBAQAAAAAAAAAAAAAAAAABETH/2gAMAwEAAhEDEQA/AM6ucSN79OjYUfZGcir8N4u2lbWq0p5OJpvE4rmyq7sI6nB6txah2dswiYOx/9k=",
      "palette": {
        "_type": "sanity.imagePalette",
        "darkMuted": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#373b4a",
          "foreground": "#fff",
          "population": 0.63,
          "title": "#fff"
        },
        "darkVibrant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#603c0c",
          "foreground": "#fff",
          "population": 0,
          "title": "#fff"
        },
        "dominant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#373b4a",
          "foreground": "#fff",
          "population": 0.63,
          "title": "#fff"
        },
        "lightMuted": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#acb4c4",
          "foreground": "#000",
          "population": 0.01,
          "title": "#fff"
        },
        "lightVibrant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#e9f1f5",
          "foreground": "#000",
          "population": 0.08,
          "title": "#000"
        },
        "muted": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#618199",
          "foreground": "#fff",
          "population": 0.01,
          "title": "#fff"
        },
        "vibrant": {
          "_type": "sanity.imagePaletteSwatch",
          "background": "#c4ac44",
          "foreground": "#000",
          "population": 0,
          "title": "#fff"
        }
      }
    },
    "mimeType": "image/webp",
    "originalFilename": "dark-mode-2.webp",
    "path": "images/rafvlnhi/production/d55abb8dbfc6b9b6ce3dae080bd8e9adae462fa5-2000x1499.webp",
    "sha1hash": "d55abb8dbfc6b9b6ce3dae080bd8e9adae462fa5",
    "size": 102656,
    "uploadId": "Rp6TvOABDIAbqBlhEn8PiwAwHAbxckPJ",
    "url": "https://cdn.sanity.io/images/rafvlnhi/production/d55abb8dbfc6b9b6ce3dae080bd8e9adae462fa5-2000x1499.webp"
  },
  "link": null,
  "markDefs": null
}
```

The theme toggle has three options:

- Light mode
- System preference
- Dark mode

If you select system preference, Cloudsmith will automatically follow your device’s theme preference (light or dark).

Please [contact us](/company/contact-us) if you have questions or feedback on dark mode.