blackdoctor-pro - Ruben Garcia Jr

Brand Guidelines v1.0

A premium health-forward brand system built for clarity, trust, and modern web experiences.

February 2026 · Web Brand Guide

01 — Color System

A palette rooted in trust

Black conveys authority. Silver communicates sophistication. Teal signals health, vitality, and forward momentum. Together they form a palette that is both clinical and warm.

Primary Blacks

Click to copy

Black Primary

#0A0A0A · rgb(10,10,10)

--black-primary

Click to copy

Black Rich

#1A1A1A · rgb(26,26,26)

--black-rich

Click to copy

Black Soft

#2D2D2D · rgb(45,45,45)

--black-soft

Silver Neutrals

Click to copy

Silver Dark

#6B6B6B · rgb(107,107,107)

--silver-dark

Click to copy

Silver Mid

#9A9A9A · rgb(154,154,154)

--silver-mid

Click to copy

Silver Light

#C8C8C8 · rgb(200,200,200)

--silver-light

Click to copy

Silver Pale

#E8E8E8 · rgb(232,232,232)

--silver-pale

Click to copy

Silver Whisper

#F4F4F4 · rgb(244,244,244)

--silver-whisper

Teal Accent

Click to copy

Teal Deep

#0D7377 · rgb(13,115,119)

--teal-deep

Click to copy

Teal Primary ★

#0F9299 · rgb(15,146,153)

--teal-primary

Click to copy

Teal Bright

#14B8C2 · rgb(20,184,194)

--teal-bright

Click to copy

Teal Light

#67D4DB · rgb(103,212,219)

--teal-light

Click to copy

Teal Pale

#B8EEF1 · rgb(184,238,241)

--teal-pale

Click to copy

Teal Whisper

#E6F9FA · rgb(230,249,250)

--teal-whisper

02 — Typography

Font pairing with purpose

Cormorant Garamond brings editorial elegance to headlines, mirroring the serif character of the original logo. DM Sans provides clean readability for body content. JetBrains Mono handles data and code.

Display

Cormorant Garamond

Light 300 / Regular 400 / Medium 500 / Semibold 600

Use for headlines, hero text, section titles, pull quotes, and feature callouts.

Health equity starts with access to knowledge.

Body

DM Sans

Regular 400 / Medium 500 / Semibold 600 / Bold 700

Use for paragraphs, navigation, buttons, form labels, UI text, and captions.

BlackDoctor Pro delivers evidence-based health information tailored for the communities that need it most. Our editorial team works with board-certified physicians to ensure every article meets the highest standards of medical accuracy and cultural relevance.

Mono

JetBrains Mono

Regular 400 / Medium 500

Use for labels, tags, metadata, stats, data displays, and technical callouts.

CATEGORY: HEART HEALTH · 8 MIN READ · DR. PATRICIA WILLIAMS
Last reviewed: February 2026 · Sources: AHA, NIH, CDC

Type Scale

Hero 56–72px Leading with care

H1 40–48px Section headline

H2 28–32px Subsection title

H3 22–24px Card & widget title

Body Large 18px Intro paragraphs and lead text

Body 16px Standard body copy and descriptions

Small 14px Captions, secondary info, buttons

Micro 11–12px LABELS · TAGS · METADATA

03 — UI Components

Building blocks

Core interactive elements styled to the BDO Pro brand. These patterns ensure consistency across all pages and components.

Buttons

Tags & Labels

Heart Health Featured 8 min read ★ Editor's Pick

Form Input

Content Card

Nutrition

Foods That Lower Blood Pressure Naturally

Evidence-based dietary changes that can reduce hypertension without medication.

03b — Dark Variants

Dark mode patterns

For dark backgrounds, hero sections, footers, and overlay components. Teal becomes even more striking against deep blacks.