The Traveler from Genshin Impact blends mythic charm with practical adventurer aesthetics, making their palette ideal for UI/UX treatments and fan assets. Key tones like Sunset Pearl #F3D46B (hair), White #FFFFFF (tunic base) and Mirage #1B1F2A (legwear contrast) create a readable, iconic silhouette that translates well into digital color codes and HEX assets. Whether you’re building a character sheet, themeable UI, or a palette pack for designers, these precise color codes and palette notes help reproduce the Traveler’s look while optimizing contrast and hierarchy for screens.
Traveler Genshin Impact Color Codes: HEX, RGB, CMYK
| Preview | Color Name | HEX | RGB | CMYK |
|---|---|---|---|---|
| Sunset Pearl | #F3D46B | 243, 212, 107 | 0, 13, 56, 5 | |
| White | #FFFFFF | 255, 255, 255 | 0, 0, 0, 0 | |
| Mirage | #1B1F2A | 27, 31, 42 | 36, 26, 0, 84 | |
| Old Copper | #6B4A2D | 107, 74, 45 | 0, 31, 58, 58 | |
| Roti | #C9A84A | 201, 168, 74 | 0, 16, 63, 21 |
Traveler CSS & Tailwind Color Variables
Select your preferred format and copy the ready-to-use CSS variables for your web projects.
:root {
/* Traveler Genshin Impact Palette */
--traveler-genshin-impact-sunset-pearl: #F3D46B;
--traveler-genshin-impact-white: #FFFFFF;
--traveler-genshin-impact-mirage: #1B1F2A;
--traveler-genshin-impact-old-copper: #6B4A2D;
--traveler-genshin-impact-roti: #C9A84A;
}More Genshin Impact Color Codes (Yellow Palette)
Traveler CSS Gradients
Beautiful gradient backgrounds inspired by Traveler’s aesthetic. Click to copy the CSS code.
Traveler Color Scheme Breakdown
Sunset Pearl#F3D46B
This warm golden blond is the Traveler’s main hair color, defining their silhouette and youthful hero vibe, and it’s the most immediately recognizable hue in both official art and in-game model.
White#FFFFFF
Clean white appears on the Traveler’s inner tunic and cloth layers, acting as a neutral base that keeps the design airy, readable, and ‘chosen one’ themed against Teyvat’s varied environments.
Mirage#1B1F2A
Near-black is used for leggings, undersuit pieces, and deep fabric panels, providing strong contrast that frames the bright hair and white outfit while giving the design a practical adventurer edge.
Old Copper#6B4A2D
Leather brown shows up on belts, straps, boots, and small gear details, grounding the otherwise celestial look with a believable travel-ready material language and subtle warmth in the costume.
Roti#C9A84A
Metallic gold accents run through trims, ornaments, and emblem-like details, reinforcing the Traveler’s star-themed identity and ‘otherworldly’ status, while visually tying the outfit together with the blond hair.
Traveler 60-30-10 Design Rule
Apply the classic 60-30-10 UI design rule using Traveler’s palette for a perfectly balanced visual hierarchy.
Traveler UI Component Preview
Here is a live example of how the Traveler color palette looks when applied to a modern UI component.
Traveler
Celestial Wanderer
“I am the Traveler.”
Traveler 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 Traveler’s aesthetic.
- Main LED: 243, 212, 107
- Accent LED: 255, 255, 255
The Design Philosophy behind Traveler’s Palette
The design philosophy behind the Traveler’s palette prioritizes narrative clarity and visual legibility: a luminous focal tone (Sunset Pearl #F3D46B) signals identity and heroism, a neutral base (White #FFFFFF) keeps the composition airy and readable, while a near-black anchor (Mirage #1B1F2A) provides strong contrast for silhouettes and interface elements. Leather and metallic accents—Old Copper #6B4A2D and Roti #C9A84A—add material realism and thematic ties to the worldbuilding. This combination succeeds because it balances symbolic color storytelling with practical contrast ratios, making the exact HEX color codes useful for designers replicating the look in UI components, icons, and branding.
Best Traveler Color Combinations
Hero Silhouette
Bright Sunset Pearl paired with deep Mirage creates an instantly readable hero silhouette and strong type/background contrast in UI.
Regal Accent
Metallic Roti with Old Copper evokes ornamentation and leather details, ideal for subtle accents and affordance cues.
Explore More Genshin Impact Character Color Codes
Download Traveler Genshin Impact Color Palette
Traveler .ASE Swatches
For Adobe Swatches & Procreate
Traveler .SVG Palette
Vector Color Palette
Traveler .PNG Image
High-Quality Palette Preview
FAQs about Traveler Genshin Impact Color Codes
What is the Traveler’s hair color HEX code?
The Traveler’s hair is Sunset Pearl with HEX #F3D46B.
What are the main outfit/base colors for the Traveler?
The outfit uses a neutral base White #FFFFFF paired with a deep contrast Mirage #1B1F2A for leggings and panels.
Which HEX codes represent the Traveler’s accents and trims?
Accent trims and metal details use Roti #C9A84A and grounded leather pieces use Old Copper #6B4A2D.
