mdshop
Back to designs
L

Design System inspired by Loom

Video messaging. Purple-blue brand, friendly illustration, async communication.

Usage
npx getdesign@latest add loom

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

Video messaging. Purple-blue brand, friendly illustration, async communication.

Preview
loom.design.md
Brand System Catalog

DESIGN SYSTEM INSPIRATION OF LOOM

Video messaging. Purple-blue brand, friendly illustration, async communication.

Explore the systemView tokens

Color Palette

Video messaging. Purple-blue brand, friendly illustration, async communication.

Primary
Loom Purple
#625df5
Brand color
Blue
#4b3fe0
Brand color
Coral
#ff7474
Brand color
Dark
#1a1a40
Brand color
White
#ffffff
Brand color
Light BG
#f5f5ff
Brand color
Gray
#6b7280
Brand color
Border
#e5e7eb
Brand color

Typography

A type system inspired by Loom.

Circular
Circular, Circular
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 Loom.

Not detected on this URL

Components

Other component primitives mapped from the Loom spec.

Not detected on this URL