Monghoul
Esc

    Themes and appearance

    Eleven built-in themes and an editor that generates a whole token set from three seed colours.

    Checked against v1.11.0 Updated

    The eleven built-in themes

    The same workspace in each one. On first launch the app picks Monghoul Dark or Monghoul Light to match the operating system, and then stays on what you chose.

    The whole workspace rendered in the Monghoul Dark theme
    Monghoul Dark
    The whole workspace rendered in the Monghoul Light theme
    Monghoul Light
    The whole workspace rendered in the Midnight Ocean theme
    Midnight Ocean
    The whole workspace rendered in the Rose Pine theme
    Rosé Pine
    The whole workspace rendered in the Nord Aurora theme
    Nord Aurora
    The whole workspace rendered in the Ember Glow theme
    Ember Glow
    The whole workspace rendered in the Catppuccin Mocha theme
    Catppuccin Mocha
    The whole workspace rendered in the Sandstone theme, a warm light theme
    Sandstone
    The whole workspace rendered in the Arctic Light theme
    Arctic Light
    The whole workspace rendered in the Ink theme, a high-contrast dark theme
    Ink
    The whole workspace rendered in the Paper theme, a light high-contrast theme
    Paper
    • Every built-in theme meets WCAG AA contrast on every surface it paints: 4.5:1 for text, 3:1 for non-text indicators such as chart series
    • Chart series are guaranteed distinguishable from one another within a theme
    • A brand accent for tier badges and highlights, kept distinct from the primary action and status colors
    • Theme changes apply instantly across the app, with no restart

    The theme editor

    The theme editor asking for a brand, background and foreground colour, with a dark or light choice and a Generate Theme button
    Fig 01 Themes · Brand, background and foreground go in, and the rest is derived
    • Theme editor with 3-color generation. Pick Brand, Background, and Foreground and the rest is derived, previewed live across the app including the code editor (Pro)
    • Background and foreground follow the brand color until you set them by hand. The light or dark choice starts from the system appearance, and switching it re-derives both (Pro)
    The theme editor after generating: a name, the app and editor fonts and sizes, and the Core colour group with its primary, secondary, accent, background and foreground swatches, over an application already repainted in the new colours
    Fig 02 Themes · Every group is editable, and the whole app previews as you change it Pro
    • Editable colors are grouped as Core, Surfaces, Borders, Status, Interaction, and MongoDB type colors, alongside typography and a palette section that regenerates the whole theme (Pro)
    • Custom themes cover app colors, semantic and interaction states, MongoDB value types, typography, editor syntax, result views, and index badges (Pro)
    • MongoDB type colors for data type badges, editable as their own group (Pro)
    • Monaco editor theming with custom token rules (Pro)
    • Import and export themes as JSON files to share (Pro)