mdshop
Back to designs
P

Design System inspired by Perplexity

AI search. Teal accent on clean light canvas, search-centric layout.

Usage
npx getdesign@latest add perplexity

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

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

AI search. Teal accent on clean light canvas, search-centric layout.

Preview
perplexity.design.md
Brand System Catalog

DESIGN SYSTEM INSPIRATION OF PERPLEXITY

AI search. Teal accent on clean light canvas, search-centric layout.

Explore the systemView tokens

Color Palette

AI search. Teal accent on clean light canvas, search-centric layout.

Primary
Perplexity Teal
#20b2aa
Brand color
Dark Teal
#147b74
Brand color
White
#ffffff
Brand color
Light BG
#f7f7f8
Brand color
Dark BG
#1b1b1d
Brand color
Text
#1b1b1d
Brand color
Gray
#6e6e6e
Brand color
Border
#e5e5e5
Brand color

Typography

A type system inspired by Perplexity.

Inter
Inter, Inter
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 Perplexity.

Not detected on this URL

Components

Other component primitives mapped from the Perplexity spec.

Not detected on this URL