ISOO Brand Foundation

The ISOO Palette

Rooted in the deep navy of the logo's eye icon and expanded through the digital presence. The palette moves from institutional depth to clinical precision - anchored in dark tones with luminous teal that activates.

Deep
#0A0022
Indigo
#1A0040
Purple
#300078
Navy
#104084
Teal
#30A8C8
Aqua
#B8F8F8
ISOO Navy
Primary Identifier
HEX #104084
RGB 16 / 64 / 132
CMYK 88 / 52 / 0 / 48
ISOO Indigo
Background / Depth
HEX #1A0040
RGB 26 / 0 / 64
CMYK 59 / 100 / 0 / 75
ISOO Teal
Accent / Action
HEX #30A8C8
RGB 48 / 168 / 200
CMYK 76 / 16 / 0 / 22

Signature Gradients

Gradients are central to ISOO's visual language - they create depth, movement, and a sense of looking through an optical instrument. Each named gradient has a defined role and CSS value.

Abyss
Abyss
Page backgrounds, dark sections, depth layers
linear-gradient(135deg,
#0A0022 0%, #1A0040 40%,
#300078 100%)
Horizon
Horizon
Section transitions, featured content, cards
linear-gradient(135deg,
#1A0040 0%, #104084 50%,
#30A8C8 100%)
Aurora
Aurora
Highlight panels, awards, special announcements
linear-gradient(135deg,
#300078 0%, #30A8C8 50%,
#B8F8F8 100%)
Iris
Iris
Event branding accents, social media, badges
linear-gradient(135deg,
#5B21B6 0%, #104084 50%,
#22D3EE 100%)
Retina
Retina
Spotlight sections, focused content, speaker bios
radial-gradient(ellipse at 30% 50%,
#300078 0%, #1A0040 40%,
#0A0022 100%)
Signal
Signal
Buttons, links, CTAs, active states, progress indicators
linear-gradient(90deg,
#30A8C8, #22D3EE)

Gradient Text

Gradient text is reserved for hero headings on dark backgrounds only. Never apply to body copy, small text, or light backgrounds where contrast cannot be guaranteed.

Ocular Oncology
Horizon on display
ISOO 2026
Aurora on display
Rio de Janeiro
Signal animated

Gradient UI Elements

Buttons, tags, dividers, and interactive elements. Signal gradient buttons use deep text for accessibility. All interactive elements include visible focus states.

Live Session Keynote On Demand

Usage Principles

Principle

Direction Matters

Linear gradients use 135 degrees as the default angle, flowing top-left to bottom-right. This creates a consistent sense of forward motion across all materials. Vertical (180deg) is acceptable for full-page backgrounds.

Principle

Mesh for Impact

Mesh gradients (overlapping radial gradients with blur) are reserved for hero moments - congress landing pages, keynote slides, event banners. They create the signature ISOO "optical flare" effect. Never use on internal documents.

Caution

Text Legibility

Gradient text is only used at 28px or larger on dark backgrounds. Never on body copy, navigation, data, or light backgrounds. Always verify sufficient contrast exists across the full gradient range.

Caution

Print Translation

Gradients don't always reproduce accurately in print. For printed materials, use flat color pairings from the palette as fallbacks. Gradient effects should be considered digital-first, with print alternatives documented.

Type System

A single typographic family across three weights and scales. Inter Tight carries display and headings with tight letter-spacing for authority. Inter handles body copy with exceptional screen legibility. JetBrains Mono provides clinical precision for data, labels, and technical elements.

Display / Headings Inter Tight
Advancing Ocular Oncology
across every border
H1 / 48-56px Congress Title
H2 / 36-44px Section Heading
H3 / 20-24px Subsection Title
Body / Interface Inter
ISOO is a professional medical society at the forefront of diagnosis and management of ocular and adnexal tumors. Our congresses connect physicians across six continents to advance research, share clinical innovation, and set the global standard of care.
Body / 15px Standard paragraph text for communications and web.
Small / 13px Captions, metadata, form labels, secondary information.
Data / System JetBrains Mono
Labels / 10px Section Labels · Navigation · Tags
Data / 11px March 17-21, 2026 · Rio de Janeiro · 09:30 EST

Recommended Combinations

Dark backgrounds carry institutional authority. Teal activates. White grounds member communications in clarity. Each pairing is tuned for a specific context.

Congress Branding

Abyss gradient + Teal

Hero banners, event pages, keynote slides

Member Communications

White + Navy text

Emails, newsletters, formal letters

Educational Content

Horizon gradient + Aqua

Course materials, programs, certificates

Identity Contexts

The ISOO mark pairs the full wordmark with the stylized eye icon featuring the signature navy tumor motifs. Always maintain clear space equal to the height of the "I" in "International" on all sides. Never recolor the navy accents.

Primary · Light background
On Mist · Documents & reports
Reversed · On Abyss gradient
Reversed · On Navy

How ISOO Communicates

ISOO speaks to physicians across six continents. Language is precise, direct, and engineered for clarity in translation. We name things plainly and lead with what matters.

Precision

Lead with the essential information. Short sentences, simple structure. Many members read English as a second or third language - clarity is a form of respect.

Authority + Warmth

Speak with the confidence of the global leader in ocular oncology while remaining collegial and approachable. Clinical expertise, human delivery.

Global by Default

No region-specific assumptions. Explicit time zones. International date formats. Name situations directly rather than euphemistically. Every communication should work from Buenos Aires to Bangalore.

Communication Formatting

Consistency across every touchpoint reinforces credibility. These standards apply to emails, documents, web content, and all member-facing materials.

Do

Scannable Structure

Bullet points, white space, short paragraphs. "Label: detail" formatting for key information. Design every communication for mobile-first reading.

Avoid

Dense Blocks

No long unbroken paragraphs. No HTML bold tags or markdown in copy-paste text. No en dashes where hyphens are standard. No venue-specific jargon unfamiliar to international audiences.

Do

Direct Language

Name situations plainly. Reference vendor obligations without dollar amounts in member-facing copy. Financial specifics belong in internal documents only.

Avoid

Assumed Context

Never assume familiarity with local customs, venue names, or regional idioms. Always include time zone references. Default to the most internationally clear phrasing.

ADA Compliance

All ISOO materials must meet WCAG 2.1 AA standards. These are the verified contrast ratios for our core color pairings. Teal (#30A8C8) is reserved for decorative and background use only - never as text on white.

Aa
Navy on White
10.05:1 AAA

Primary headings, links, and emphasis text on light backgrounds.

Aa
Indigo on White
18.78:1 AAA

Display headings, section titles, and high-contrast applications.

Aa
Charcoal (#333) on White
12.63:1 AAA

Primary body text. Use for all paragraph and content text.

Aa
ADA Teal (#0E7490) on White
5.36:1 AA

Labels, tags, and accent text on light backgrounds. Use this darker teal instead of #30A8C8 for any text on white.

Aa
White on Navy
10.05:1 AAA

Buttons, navigation on dark backgrounds, and reversed layouts.

Aa
Deep on Teal
7.30:1 AAA

Teal accent backgrounds with dark text. Use Deep (#0A0022) or Indigo (#1A0040) text on teal surfaces.

Requirement

Minimum Contrast

All text must meet WCAG AA: 4.5:1 for normal text, 3:1 for large text (18px+ or 14px+ bold). Non-text UI elements (icons, borders, form controls) require 3:1 against adjacent colors.

Requirement

Color Independence

Never convey information through color alone. Pair color with text labels, icons, or patterns. Error states must include text descriptions, not just red highlighting.

Requirement

Focus Visibility

All interactive elements must have a visible focus indicator. Use a 3px Navy (#104084) outline with 3px offset. Never remove default browser focus styles without providing a replacement.

Requirement

Motion Sensitivity

All animations must respect the prefers-reduced-motion media query. Gradient shimmer effects, mesh animations, and hover transitions must be disabled when the user has requested reduced motion.

Where This Lives

This foundation applies across every touchpoint. Future congresses adapt local character while holding this core system.

Digital

Website, X-CD platform, member portal, virtual events, social media

Congress

Signage, programs, badges, slides, sponsor materials, course collateral

Correspondence

Board comms, member outreach, speaker invitations, vendor letters

Future Events

Africa, Greece 2028, and beyond - local flavor within this core system