
Click a swatch to copy its HEX; hover for the OKLCH value.
The gradient distilled from the scene, unrolled left to right by stop; the authored angle is 350° (used by the hero and exports), while gallery cards share a uniform 135° sweep.
Let the achromatics build the frame and colour is free to carry identity alone. Here 42.7% of pixels sit below the grey threshold at a median chroma of 0.032, and the lightness structure is held up by flagstones at L 0.83 — so the vermilion post and the shop shadow beside it can share L 0.35 and be separated by chroma alone (0.074 against 0.017).
CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.
/* Mingxing Jewelry at High Noon · Mingxing Jewelry at High Noon — Teyvat Palette */
:root {
--eave-shadow: oklch(0.35 0.017 298); /* Eave Shadow #3b3942 */
--vermilion-post: oklch(0.35 0.074 4); /* Vermilion Post #592836 */
--potted-maple: oklch(0.46 0.08 133); /* Potted Maple #466231 */
--signboard-gold: oklch(0.59 0.069 95); /* Signboard Gold #8a7d4c */
--flagstone: oklch(0.83 0.037 115); /* Flagstone #c6cbb0 */
--gradient-mingxing-jewelry: linear-gradient(350deg, oklch(0.35 0.017 298) 0%, oklch(0.35 0.074 4) 22%, oklch(0.46 0.08 133) 46%, oklch(0.59 0.069 95) 70%, oklch(0.83 0.037 115) 100%);
}A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.