AETHER
Brand Style Guide & Design System
01 — Foundation
Color Palette
Navy Blues — Primary Backgrounds
Navy 900
#0a0f1e
hsl(225, 50%, 8%)
Main background
Navy 800
#0d1a36
hsl(221, 61%, 13%)
Card backgrounds
Navy 700
#112244
hsl(220, 60%, 17%)
Borders, panels
Navy 600
#1a3060
hsl(218, 57%, 23%)
Hover states
Navy 500
#1e3d7a
hsl(216, 60%, 30%)
Active elements
Light Gold — Primary Accent
Gold 400
#f0d980
hsl(48, 81%, 72%)
Glow highlights, gradients
Gold 500
#e8c96a
hsl(45, 74%, 66%)
Hover gold, bright accent
Gold 600
#c9a84c
hsl(42, 55%, 55%)
Primary gold, CTA, icons
Gold 700
#a08530
hsl(40, 54%, 40%)
Deep gold, pressed states
Text Neutrals
White 100
#f0f4ff
hsl(224, 100%, 97%)
Primary text, headings
White 200
#a8b8d8
hsl(220, 38%, 75%)
Body text, descriptions
White 300
#6b7fa0
hsl(218, 22%, 52%)
Captions, disabled text
02 — Typography
Fonts & Type Scale
Cormorant Garamond
Elegance in every curve.
Weights used: 300 · 400 · 500 · 600 · 700
Styles: Regular + Italic
Source: Google Fonts
Styles: Regular + Italic
Source: Google Fonts
Inter
Clarity at every size. Built for screens, optimised for reading.
Weights used: 300 · 400 · 500 · 600
Source: Google Fonts
Source: Google Fonts
Heading Scale — Cormorant Garamond
Crafting Digital Realities.
Creative Intelligence.
Every website is a universe.
WordPress + Divi, hand-crafted.
SEO & AI optimised by design.
No templates. No shortcuts. Just craft.
Body & UI Scale — Inter
Not a template. Not an agency factory. Just one devoted creator pouring soul into every pixel, building custom web experiences that resonate on a higher frequency.
Every website I build is designed and developed from scratch. I use WordPress in combination with Divi to create unique, high-performance websites tailored to your brand identity.
Last updated January 2026 · All rights reserved · Aether Design Bureau
Digital Architect & Creator
Web Design & Development · WordPress · Divi · SEO · AIO
03 — Interactive
Buttons — All States
Primary Button (Filled Gold)DEFAULT
Let's Create Together
HOVER
Let's Create Together
ACTIVE / PRESSED
Let's Create Together
DISABLED
Let's Create Together
DEFAULT
Initiate Contact
HOVER
Initiate Contact
ACTIVE / PRESSED
Initiate Contact
DISABLED
Initiate Contact
Button Specifications
| Property | Small | Medium | Large |
|---|---|---|---|
| Padding | 8px 22px | 14px 36px | 18px 48px |
| Font size | 11px | 12px | 13px |
| Border radius | 9999px (pill) | 9999px (pill) | 9999px (pill) |
| Letter spacing | 0.2em | 0.2em | 0.2em |
04 — Depth
Drop Shadow Effects
Shadow SM
0 2px 8px rgba(0,0,0,0.40)
Shadow MD
0 4px 20px rgba(0,0,0,0.50)
Shadow LG
0 8px 40px rgba(0,0,0,0.60)
Gold Glow Subtle
0 0 20px rgba(232,201,106,0.15)
0 0 40px rgba(232,201,106,0.05)
0 0 40px rgba(232,201,106,0.05)
Gold Glow Medium
0 0 25px rgba(232,201,106,0.30)
0 0 60px rgba(232,201,106,0.10)
0 0 60px rgba(232,201,106,0.10)
Gold Glow Strong
0 0 40px rgba(232,201,106,0.50)
0 0 80px rgba(232,201,106,0.20)
0 0 80px rgba(232,201,106,0.20)
Card Shadow
0 8px 32px rgba(0,0,0,0.50)
0 0 0 1px rgba(201,168,76,0.10)
0 0 0 1px rgba(201,168,76,0.10)
Text Glow
text-shadow: 0 0 12px rgba(240,217,128,0.50)
05 — Structure
Borders & Border Radii
Border Styles
Border Thin
1px solid rgba(201,168,76, 0.20)
Default card borders, subtle dividers
Border Medium
2px solid rgba(201,168,76, 0.40)
Active inputs, focused elements
Border Strong
2px solid #c9a84c
Selected state, primary highlight
Border Glow
1px solid rgba(201,168,76, 0.60)
CTA buttons, hover glow effect
Border Radii
Radius SM
4px
Radius MD
8px
Radius LG
16px
Radius Full
9999px (pill)
06 — Gradients
Gradient Library
Gold Text Gradient
135deg · #f0d980 → #e8c96a → #c9a84c
Headings, logo, hero title highlight
Navy Depth Gradient
180deg · #0a0f1e → #0d1a36 → #112244
Section backgrounds, overlays
Gold Nebula Radial
radial · rgba(201,168,76,0.12) → transparent
Hero glow, closer CTA background halo
Gold Horizontal Rule
90deg · transparent → rgba(201,168,76,0.4) → transparent
Section dividers, decorative lines
Nebula Background
Multi-radial navy cloud effect
Section overlays, closer, blog section
Card Shimmer Gradient
135deg · rgba(gold,0.08) → rgba(navy,0.5)
Card hover states, service tiles
07 — Portfolio Artwork
Generated Mockup Images
Restaurant Website
Beauty & Spa Website
Coach / Therapist Website
E-Commerce Webshop
AETHER
Brand Style Guide · Version 1.0 · 2026