Trailblazer — Honkai Star Rail Color Codes, Palette & HEX Reference

Trailblazer — Honkai Star Rail Color Codes, Palette & HEX Reference

The Trailblazer of Honkai Star Rail blends utilitarian silhouette with cosmic accents, creating a protagonist look that reads clearly in-game and in fan design. The deep charcoal #0E0E10 (Woodsmoke) anchors the outfit while bright highlights like #FFD166 (Golden Tainoi) and #2EE6D6 (Robins Egg Blue) guide the eye across focal details. Subtle neutrals such as #F5F7FA (Catskill White) and ethereal glows like #B77BFF (Heliotrope) balance contrast and mood. This palette is ideal for designers searching for precise color codes, HEX references, and palette inspiration for UI/UX or character art.

Woodsmoke
#0E0E10
Catskill White
#F5F7FA
Golden Tainoi
#FFD166
Robins Egg Blue
#2EE6D6
Heliotrope
#B77BFF

Trailblazer Honkai Star Rail Color Codes: HEX, RGB, CMYK

Preview Color Name HEX RGB CMYK
Woodsmoke #0E0E10 14, 14, 16 12, 12, 0, 94
Catskill White #F5F7FA 245, 247, 250 2, 1, 0, 2
Golden Tainoi #FFD166 255, 209, 102 0, 18, 60, 0
Robins Egg Blue #2EE6D6 46, 230, 214 80, 0, 7, 10
Heliotrope #B77BFF 183, 123, 255 28, 52, 0, 0

Trailblazer CSS & Tailwind Color Variables

Select your preferred format and copy the ready-to-use CSS variables for your web projects.

:root {
/* Trailblazer Honkai Star Rail Palette */
--trailblazer-honkai-star-rail-woodsmoke: #0E0E10;
--trailblazer-honkai-star-rail-catskill-white: #F5F7FA;
--trailblazer-honkai-star-rail-golden-tainoi: #FFD166;
--trailblazer-honkai-star-rail-robins-egg-blue: #2EE6D6;
--trailblazer-honkai-star-rail-heliotrope: #B77BFF;
}

More Honkai: Star Rail Color Codes (Yellow Palette)

Trailblazer CSS Gradients

Beautiful gradient backgrounds inspired by Trailblazer’s aesthetic. Click to copy the CSS code.

Click to Copy CSS
Woodsmoke to Robins Egg Blue#0E0E10 → #2EE6D6
Click to Copy CSS
Golden Tainoi to Woodsmoke#FFD166 → #0E0E10

Trailblazer Color Scheme Breakdown

Woodsmoke#0E0E10

Used on the Trailblazer’s outer jacket, trousers, and boots, this deep charcoal defines the character’s silhouette, grounding the design visually and conveying practicality, stealth, and structural weight to the overall costume.

Catskill White#F5F7FA

A cool off-white present in the Trailblazer’s hair, inner shirt, and cape lining, this hue suggests a blank-slate protagonist aesthetic while highlighting facial features and contrasting strongly with darker costume elements.

Golden Tainoi#FFD166

A bright saffron gold used for trims, the chest emblem, belt details and small hardware, this accent conveys leadership, hope, and navigational symbolism while drawing eye paths across the silhouette’s focal points.

Robins Egg Blue#2EE6D6

A vivid teal-cyan streak found on energy effects, trims and accessory LEDs, this color signals the Trailblazer’s technological and cosmic connection, adding freshness and futuristic contrast to warmer gold accents.

Heliotrope#B77BFF

Soft lavender-purple appears in subtle glow effects, vision flares and some clothing panels, imbuing the character with mysticism and otherworldly resonance while harmonizing between the cyan energy and yellow ornamentation.

Trailblazer 60-30-10 Design Rule

Apply the classic 60-30-10 UI design rule using Trailblazer’s palette for a perfectly balanced visual hierarchy.

60% Background
#F5F7FA
30% Primary
#B77BFF
10% Accent
#0E0E10

Use Catskill White (#F5F7FA) for large background spaces, Heliotrope (#B77BFF) for primary text and structural UI elements, and vibrant Woodsmoke (#0E0E10) exclusively for call-to-action buttons and important highlights.

Trailblazer UI Component Preview

Here is a live example of how the Trailblazer color palette looks when applied to a modern UI component.

Trailblazer

Cosmic Scout Leader

“Onward, to the stars!”

Trailblazer Gaming Setup (RGB Peripherals)

Sync your gaming gear! Use these exact RGB values for your Razer Chroma, Corsair iCUE, or Logitech G Hub software to match Trailblazer’s aesthetic.

  • Main LED: 14, 14, 16
  • Accent LED: 245, 247, 250

The Design Philosophy behind Trailblazer’s Palette

The design philosophy behind the Trailblazer’s palette uses contrast and narrative signaling to communicate role and tone. A low-key base (#0E0E10 Woodsmoke) conveys practicality and weight, while a cool off-white (#F5F7FA Catskill White) frames facial features and suggests a blank-slate protagonist. Accent colors — saffron gold (#FFD166 Golden Tainoi) for emblematic leadership and teal-cyan (#2EE6D6 Robins Egg Blue) for technological energy — create visual hierarchy and motion. Heliotrope (#B77BFF) adds mystic resonance, bridging warm and cool accents. Together these color codes form a coherent HEX palette that supports storytelling, readability in UI contexts, and clear asset handoff for designers working from color references.

Best Trailblazer Color Combinations

Anchor & Highlight

A deep anchor paired with bright saffron creates immediate focal contrast ideal for call-to-action elements and emblem highlights.

Tech & Ethereal

Teal-cyan energy tones combined with soft heliotrope produce a futuristic yet mystical accent duo suited for HUD glows and particle effects.

Download Trailblazer Honkai Star Rail Color Palette

ASE

Trailblazer .ASE Swatches

For Adobe Swatches & Procreate

SVG

Trailblazer .SVG Palette

Vector Color Palette

PNG

Trailblazer .PNG Image

High-Quality Palette Preview

FAQs about Trailblazer Honkai Star Rail Color Codes

What is the Trailblazer’s hair color hex code?

The Trailblazer’s hair and inner accents use a cool off-white: #F5F7FA (Catskill White).

What is the main outfit color or base tone hex?

The primary outfit base is a deep charcoal: #0E0E10 (Woodsmoke).

Which hex codes represent the costume’s accent and energy colors?

Accent and energy tones include #FFD166 (Golden Tainoi) for trims and #2EE6D6 (Robins Egg Blue) for tech effects, with #B77BFF (Heliotrope) as a subtle glow.

Copied