Brand Guide

Color tokens, logo usage, typography, and the Abeedoo visual identity.

Color Tokens

The Abeedoo palette — dark glassmorphism with purple, cyan, and pink-red accents.

Name	Token	Value	Usage
Primary (Purple)	`--color-primary`	`#7c5cff`	Buttons, links, primary actions
Secondary (Cyan)	`--color-secondary`	`#2de2e6`	Accents, highlights, secondary actions
Accent (Pink-Red)	`--color-accent`	`#ff2e63`	Danger states, emphasis, alerts
Background	`--color-base-200`	`#060812`	Page background
Surface	`--color-base-100`	`#0c0e1a`	Card backgrounds, elevated surfaces
Surface Alt	`--color-base-300`	`#12152a`	Borders, dividers, subtle contrast
Neutral	`--color-neutral`	`#1a1d2e`	Sidebar, dark panels
Text	`--color-base-content`	`#e8eefc`	Primary text, headings
Muted Text	`—`	`#a9b6d8`	Secondary text, descriptions
Border	`—`	`rgba(255,255,255,.10)`	Card borders, dividers

DaisyUI Theme CSS

@plugin "daisyui/theme" {
  name: "abeedoo";
  default: true;
  color-scheme: dark;

  --color-primary: #7c5cff;
  --color-primary-content: #ffffff;
  --color-secondary: #2de2e6;
  --color-secondary-content: #081018;
  --color-accent: #ff2e63;
  --color-accent-content: #ffffff;
  --color-neutral: #1a1d2e;
  --color-neutral-content: #e8eefc;
  --color-base-100: #0c0e1a;
  --color-base-200: #060812;
  --color-base-300: #12152a;
  --color-base-content: #e8eefc;
  --color-info: #3b82f6;
  --color-success: #22c55e;
  --color-warning: #eab308;
  --color-error: #ff2e63;
}

Logo

The Abeedoo mark is a 2×2 grid of circles — purple on top, cyan on bottom. Used with and without the wordmark.

On dark background

abeedoo

With wordmark

On gradient

4-Color Experiments

Exploring variants where each circle gets its own color. Same mark, more personality.

Current (2-tone)

Full Palette

Warm Diagonal

Neon Corners

Sunset

Ocean

Jewel

Electric

With Wordmark

Each variant paired with the wordmark at nav size.

abeedoo Current (2-tone)

abeedoo Full Palette

abeedoo Warm Diagonal

abeedoo Neon Corners

abeedoo Sunset

abeedoo Ocean

abeedoo Jewel

abeedoo Electric

Typography

System UI font stack for fast loading and native feel across platforms.

Font Stack

ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif

Heading 1

The quick brown fox

Heading 2

The quick brown fox

Heading 3

The quick brown fox

Body

The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.

Small / Muted

The quick brown fox jumps over the lazy dog.

Theme Palette

Full DaisyUI-compatible palette for the Abeedoo dark theme.

Primary

#7c5cff

Secondary

#2de2e6

Accent

#ff2e63

Neutral

#1a1d2e

Base 100

#0c0e1a

Base 200

#060812

Info

Success

Warning

Error

Abeedoo Nav Item Nav Item CTA