mdshop
Back to designs
P

Design System inspired by Prisma

Database toolkit. Teal brand, dark docs, TypeScript-first aesthetic.

Usage
npx getdesign@latest add prisma

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 Prisma design system. A curated starting point for building Prisma-like UIs with your AI coding agent.

Database toolkit. Teal brand, dark docs, TypeScript-first aesthetic.

Preview
prisma.design.md
Brand System Catalog

DESIGN SYSTEM INSPIRATION OF PRISMA

Database toolkit. Teal brand, dark docs, TypeScript-first aesthetic.

Explore the systemView tokens

Color Palette

Database toolkit. Teal brand, dark docs, TypeScript-first aesthetic.

Primary
Prisma Teal
#2d3748
Brand color
Prisma Blue
#5a67d8
Brand color
Indigo
#4c51bf
Brand color
Dark
#1a202c
Brand color
White
#ffffff
Brand color
Light BG
#f7fafc
Brand color
Gray
#a0aec0
Brand color
Border
#e2e8f0
Brand color

Typography

A type system inspired by Prisma.

Barlow
Barlow, Barlow
JetBrains Mono
JetBrains Mono, Barlow
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 Prisma.

Not detected on this URL

Components

Other component primitives mapped from the Prisma spec.

Not detected on this URL