Back to ObservesSystem Identity v2.0

Brand Assets & UI Guidelines

Consolidated branding system, visual styles, color palettes, and interface guidelines for **BlobLens**. Use these assets and design specs to maintain design consistency across our ecosystem.

Vector Logo Assets

Main / Colored

bloblens-logo.svg

SVG · Color · Animated

Monochrome White

bloblens-white.svg

SVG · White · Animated

Monochrome Black

bloblens-black.svg

SVG · Black · Animated

Favicon Kit & Webmanifest

Asset Map/public/favicon/*

favicon.ico

Legacy Shortcut Icon

32x32 / 16x16Save

favicon-16x16.png

Standard Browser Tab

16x16Save

favicon-32x32.png

High-DPI Browser Tab

32x32Save

apple-touch-icon.png

Apple iOS HomeScreen

180x180Save

android-chrome-192x192.png

Android App Launch Icon

192x192Save

android-chrome-512x512.png

Android Large Splash

512x512Save

site.webmanifest

PWA Manifest Config

JSON configSave

Color System

Click on any swatch below to copy its hex value directly to your clipboard.

Brand Core

Purple Core (Logo)

#914af8

Emerald (BPO2)

#10B981

Sky Blue (BPO1)

#0EA5E9

Violet (Pectra)

#8B5CF6

System Neutrals

Core Background

#07090E

Surface Panel

#0E131F

Elevated Border

#1F2937

Text Primary

#F3F4F6

Typography System

Sans-Serif Font (Outfit / Inter)

Outfit Sans-Serif

Used for headings, main dashboard stats, and high-impact UI elements.

Monospace Font (Geist Mono)

Geist Monospace

Used for telemetry metrics, block numbers, transaction hashes, and all tabular data representation.

UI Style Tokens

Glassmorphism Card styling

.card-glass {
  background: rgba(14, 19, 31, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(16px);
}

Green Glow drop-shadow

.glow-green {
  filter: drop-shadow(0 0 12px rgba(16, 185, 129, 0.35));
}

BlobLens

Initializing DA Telemetry…