Sayu from Genshin Impact blends sleepy charm with stealthy ninja aesthetics, making her palette a useful study for UI/UX designers seeking character-driven color systems. Her muted purple hood (Scampi #6B5AA6) anchors the look, while warm trim accents like Tacha #D7B56F and soft highlights Westar #E6E1DB keep compositions readable and friendly. For anyone searching for Sayu HEX codes or character color palette references, these exact color codes and contextual notes help recreate her cozy-yet-stealthy silhouette in UI mockups, game art, and branding samples with accessible contrast and visual personality.
Sayu Genshin Impact Color Codes: HEX, RGB, CMYK
| Preview | Color Name | HEX | RGB | CMYK |
|---|---|---|---|---|
| Scampi | #6B5AA6 | 107, 90, 166 | 36, 46, 0, 35 | |
| Tacha | #D7B56F | 215, 181, 111 | 0, 16, 48, 16 | |
| Yellow Metal | #7A5A3A | 122, 90, 58 | 0, 26, 52, 52 | |
| Steel Gray | #1F1B2A | 31, 27, 42 | 26, 36, 0, 84 | |
| Westar | #E6E1DB | 230, 225, 219 | 0, 2, 5, 10 |
Sayu CSS & Tailwind Color Variables
Select your preferred format and copy the ready-to-use CSS variables for your web projects.
:root {
/* Sayu Genshin Impact Palette */
--sayu-genshin-impact-scampi: #6B5AA6;
--sayu-genshin-impact-tacha: #D7B56F;
--sayu-genshin-impact-yellow-metal: #7A5A3A;
--sayu-genshin-impact-steel-gray: #1F1B2A;
--sayu-genshin-impact-westar: #E6E1DB;
}More Genshin Impact Character Color Palettes Color Codes (Purple Palette)
Sayu CSS Gradients
Beautiful gradient backgrounds inspired by Sayu’s aesthetic. Click to copy the CSS code.
Sayu Color Scheme Breakdown
Scampi#6B5AA6
Primary muted purple seen across Sayu’s hooded ninja outfit and outer fabric panels, defining her sleepy Inazuman shinobi silhouette and reinforcing a calm, stealthy, low-energy personality.
Tacha#D7B56F
Warm tan-gold used on key trims and decorative elements on her outfit and accessories, suggesting traditional Inazuma craftsmanship while adding a gentle, cozy contrast to the dominant purples.
Yellow Metal#7A5A3A
Earthy medium brown found in her hair and some leather-like details, grounding the palette and emphasizing her practical, outdoorsy ninja vibe despite the cute, pajama-like overall design.
Steel Gray#1F1B2A
Deep near-black appears in inner clothing layers, undersuit areas, and shadowed fabric pieces, providing strong value contrast and enhancing the stealth aesthetic typical of a compact ninja character.
Westar#E6E1DB
Soft off-white shows on lighter cloth sections and small highlights on her outfit, keeping the design airy and youthful while balancing the heavier dark tones and muted purple dominance.
Sayu 60-30-10 Design Rule
Apply the classic 60-30-10 UI design rule using Sayu’s palette for a perfectly balanced visual hierarchy.
Sayu UI Component Preview
Here is a live example of how the Sayu color palette looks when applied to a modern UI component.
Sayu
Sleepy Ninja
“I must hurry and take a nap!”
Sayu 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 Sayu’s aesthetic.
- Main LED: 107, 90, 166
- Accent LED: 215, 181, 111
The Design Philosophy behind Sayu’s Palette
The design philosophy behind Sayu’s palette uses restrained contrast and culturally anchored accents to mirror her narrative: a small Inazuman shinobi who prefers naps over battle. Scampi (#6B5AA6) provides a muted, calming primary that reads as quiet and stealthy, while Tacha (#D7B56F) supplies traditional, handcrafted warmth on trims and accessories; Yellow Metal (#7A5A3A) grounds the character with earthy practicality in hair and leather details. Steel Gray (#1F1B2A) acts as the deep value layer for shadows and inner garments, and Westar (#E6E1DB) offers light, youthful highlights. Together these HEX color codes balance personality, readability, and cultural cues—useful when selecting color codes for UI palettes, character sheets, or branding that must convey softness without losing functional contrast.
Best Sayu Color Combinations
Sleepy Contrast
Muted Scampi paired with soft Westar creates a legible, calm UI pairing ideal for backgrounds and primary content with gentle contrast.
Warm Accent Anchor
Scampi’s muted purple with Tacha’s warm tan-gold provides a balanced main/ accent duo that adds cultural richness and focal points in graphic elements.
Explore More Genshin Impact Character Color Palettes Character Color Codes
Download Sayu Genshin Impact Color Palette
Sayu .ASE Swatches
For Adobe Swatches & Procreate
Sayu .SVG Palette
Vector Color Palette
Sayu .PNG Image
High-Quality Palette Preview
FAQs about Sayu Genshin Impact Color Codes
What is the HEX code for Sayu’s hair color?
Sayu’s hair and leather details use an earthy brown: #7A5A3A (Yellow Metal).
Which HEX code represents Sayu’s primary outfit color?
The primary muted purple of Sayu’s hood and outer fabric is #6B5AA6 (Scampi).
What HEX codes are used for Sayu’s trims and highlights?
Trims use a warm tan-gold #D7B56F (Tacha) while light cloth highlights use #E6E1DB (Westar).
