🎨 TypeDialog Logos

Typed dialogs for inputs, forms and schemas you can trust.

📋 Logo Variants

typedialog_logo.svg

Vertical • Animated • Full Color

typedialog_logo_h.svg

Horizontal • Animated • Full Color

typedialog_logo_s.svg

Vertical • Static • Full Color

typedialog_logo_h_s.svg

Horizontal • Static • Full Color

🎯 Icon & Mark

typedialog_icon.svg

64×64 • Animated • App Icon

typedialog_icon_s.svg

64×64 • Static • Favicon

✍️ Typography

typedialog_text.svg

Text • Animated • Wordmark

typedialog_text_s.svg

Text • Static • Wordmark

⚫ Black & White

For print, stamping, and monochrome contexts

typedialog_icon_bn.svg

Icon • Monochrome • Print

typedialog_logo_h_bn.svg

Horizontal • Monochrome • Print

📏 Scalability Test

Icon clarity at different sizes

16×16

Favicon

32×32

Browser tab

64×64

App icon

128×128

Apple touch

🎨 Color Palette

Official TypeDialog brand colors (click to copy)

Primary Gray

#3a3a50

Bubble, primary text

Accent Indigo

#4f46e5

Cursor, interactive

Secondary Gray

#8f96a3

Text, secondary elements

White

#ffffff

Brackets, accents

✏️ Typography

TypeDialog

Font: Inter • Weight: 500 • Size: 16-20px

Usage: Inter is used for all typography in TypeDialog branding. The font is clean, modern, and highly readable at all sizes.

Import: @import url('https://fonts.googleapis.com/css2?family=Inter:wght@500&display=swap');

Font-family: font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;