mdshop
Back to designs
M

Design System inspired by MongoDB

Document database. Green brand, developer docs, leaf logo motif.

Usage
npx getdesign@latest add mongodb

Run this command from your project root, then ask your AI assistant to use DESIGN.md for UI work.

Installs
15
Bookmarked
0
Not an official MongoDB design system. A curated starting point for building MongoDB-like UIs with your AI coding agent.

Document database. Green brand, developer docs, leaf logo motif.

Preview
mongodb.design.md
Brand System Catalog

DESIGN SYSTEM INSPIRATION OF MONGODB

Document database. Green brand, developer docs, leaf logo motif.

Explore the systemView tokens

Color Palette

Document database. Green brand, developer docs, leaf logo motif.

Primary
Mongo Green
#00ed64
Brand color
Dark Green
#001e2b
Brand color
Forest
#023430
Brand color
White
#ffffff
Brand color
Light BG
#f9fbfa
Brand color
Gray
#889397
Brand color
Slate
#1c2d38
Brand color
Border
#e8edeb
Brand color

Typography

A type system inspired by MongoDB.

MongoDB Value Serif
MongoDB Value Serif, MongoDB Value Serif
Euclid Circular
Euclid Circular, MongoDB Value Serif
DISPLAY / 64px / 700 / 1.1
EVERYONE
H1 / 48px / 700 / 1.2
A disciplined editorial voice
H2 / 32px / 600 / 1.3
Section heading
BODY / 16px / 400 / 1.6
Body copy reads at the size and rhythm extracted from the source spec. Lorem ipsum dolor sit amet.
SMALL / 14px / 400 / 1.5
Small
CODE / 14px / 400 / 1.6
Code

Buttons

Buttons, cards, and inputs follow the brand's visual language with consistent use of the primary color palette and border-radius conventions.

Not detected on this URL

Cards

Card patterns inspired by MongoDB.

Not detected on this URL

Components

Other component primitives mapped from the MongoDB spec.

Not detected on this URL