FerryConnect
🎨 Design System & Visual Identity

FerryConnect Brand System

The maritime visual identity, oceanic color palette, typography hierarchy, and UI component standards that power FerryConnect.

1. Logo & Identity Mark

The FerryConnect logo combines a forward-thrusting passenger ship bow cutting through dual oceanic wake curves, symbolizing connectivity between two shores.

FerryConnect
Dark Background (Primary)
FerryConnect
Light Background

2. Maritime Color Palette

Engineered specifically for maritime travel — oceanic navy depth, vibrant seafoam highlights, and nautical warning accents.

Deep Ocean

ocean-950 · #072849

Command headers, footers & contrast elements.

Nautical Blue

ocean-700 · #006fc7

Primary brand CTA buttons and active elements.

Marine Seafoam

marine-500 · #019e90

Brand mark secondary accent and link highlights.

Sunset Coral

coral-500 · #ff6b4a

Sea state warnings, alerts & urgent weather notices.

3. UI Component System

Reusable UI patterns built with Tailwind v4 for consistent cross-device experience.

Route & Feature Badges

Standardized pills with icons for crossing attributes.

⏱ 1h 30m Crossing🐕 Pet Friendly Lounge🚗 Vehicles Accepted⚠️ Weather Advisory

Maritime Telemetry

Monospace typography for navigational data.

UN/LOCODEGBDOV
Coordinates51.1279° N, 1.3134° E

Read Full Brand Documentation

Complete positioning, editorial rules, copy guidelines, and tone of voice.