CURATED · OPEN · FREE

Weaviate

An open-source platform for building complete AI experiences with vector search, RAG, and memory.

devai
Weaviate screenshot
↓ Download design system (29 MB)Open in OpenDesign

Visit: https://weaviate.io

📦 Browse pack contents →

01

Identity DNA

Vector SearchAI PlatformDeveloperOpen SourceRAG

A sleek, dark-themed cockpit for developers building the next generation of AI applications.

02

Color

#44e4c5Accent
#ffffffInk
#b9c8deInk soft
#151515BG
#1a1a1aBG soft
#0a0e13BG quiet
rgba(255, 255, 255, 0.1)Line

Dark base with vibrant teal accents to highlight technical precision and modernity.

03

Typography

transitional-serif · humanist-sans · monospace

Use Plus Jakarta Sans for body text to ensure technical clarity. · Use Inter for UI elements and navigation. · Use monospace for code snippets to maintain a developer-centric feel. · Avoid overly decorative or playful typefaces.

04

Spacing

4px
8px
16px
24px
32px
48px
64px
96px

Maintains a consistent 4px base grid with generous padding for whitespace and clarity.

05

Surfaces

sm · 4px
md · 8px
lg · 12px
pill · 999px

Subtle 1px borders with rgba(255, 255, 255, 0.1) to separate sections.

rgba(0, 0, 0, 0.16) 0px 20px 60px 0px · rgba(0, 0, 0, 0.22) 0px 10px 40px 0px · rgba(255, 255, 255, 0.08) 0px 1px 0px 0px inset

06

Layout

1280container
12columns
24pxgutter
768 / 1024breakpoints

A standard grid-based layout with centered content and generous vertical rhythm.

07

Motion & Interaction

150msmicro
200mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

Smooth color and background transitions for interactive elements. · Subtle fade-ins for content appearance.

Subtle color shifts and background changes for buttons and links. · Minimal visual feedback, prioritizing speed.

08

Components

09

Voice & Don'ts

10

Inside the pack — real screenshots

Captured from the live site · real computed styles

11

System prompt

Weaviate is a developer-centric AI platform for vector search and RAG. The design DNA is a dark mode interface with a #151515 background, #44e4c5 teal accents, and a mix of transitional-serif and humanist-sans typography. The layout is spacious, using a 12-column grid. Critical donts include: don't use a light background, don't use playful sans-serif fonts for headlines, and don't clutter the interface with unnecessary borders. The voice is technical and authoritative, focusing on developer productivity.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

en · zh-CN · zh-TW · ja · ko