Brand Guidelines

This document serves as the source of truth for the Baray brand identity. It is designed to be consumed by both human designers and AI agents generating content for the Baray ecosystem.

# Logo

App Icon Dark
App Icon (Dark)
App Icon Light
App Icon (Light)
B Symbol Dark
Symbol (Dark)
B Symbol Light
Symbol (Light)

The Baray logo is a bold, geometric "B" that represents stability and infrastructure. It should primarily be used in Brand-950 (Dark Navy) on light backgrounds, or White on dark backgrounds.

# Color Palette

Brand (Indigo/Navy)

Brand-50

#eef2ff

Brand-100

#e0e7ff

Brand-200

#c7d2fe

Brand-300

#a5b4fc

Brand-400

#818cf8

Brand-500

#6366f1

Brand-600

#4f46e5

Brand-700

#4338ca

Brand-800

#3730a3

Brand-900

#312e81

Brand-950

#1e1b4b

Accent (Teal)

Accent-50

#f0fdfa

Accent-100

#ccfbf1

Accent-200

#99f6e4

Accent-500

#14b8a6

Accent-600

#0d9488

Accent-700

#0f766e

# Typography

Primary Font

Geist Sans

The quick brown fox jumps over the lazy dog.

Usage: Headings, Body Text, UI Elements

Code Font

Geist Mono

const baray = "infrastructure";

Usage: Code blocks, API keys, Technical data

# Tone of Voice

Do This

  • Be concise and technical.
  • Focus on "infrastructure" and "reliability".
  • Use active voice (e.g., "Connect to banks").
  • Highlight security and compliance.

Avoid This

  • Don't use marketing fluff or buzzwords.
  • Don't imply we are a bank (we are a middleware).
  • Don't be overly casual or playful.
  • Avoid "disrupting" or "revolutionizing" rhetoric.

# UI Components

Buttons

Gradients

Subtle Vertical Gradient (Backgrounds)