Highlights from each release
The scene library shipped with thirty written studies and a long list of pictures nobody had looked at yet. That list is empty.
There are 184 of them now, each one a person's argument about a single picture — what its colours are doing and the one rule you could take somewhere else — and each with a Japanese and an English translation. The gallery shows the whole library for the first time.
Each number a study quotes comes off a measuring bench that samples every picture the same way. That also makes it possible to prove a negative: several studies establish that a frame contains no warm pixel at all, in places where the eye had confidently reported golden sand and red roof tiles.
A new study either says something no other study has said, or takes on one that has. The second kind turned out to be the interesting one — the rules that later pictures narrowed are the ones worth trusting, and several of the library's headline claims now carry the conditions under which they hold.
Official Chinese and Japanese names are fetched rather than translated by hand, and where none exists the library says so instead of letting a plausible guess pass as official.
The studio, the scene library and the page preview finally look like places you can go, instead of three more grey icons.
The three destinations now sit together in the middle of the navigation, each with a hue of its own, while the settings stay grey on the right. A single highlight slides between them, and only the one you are in spells out its name.
The plain gradient is no longer offered as a backdrop for a generated page: a light palette turned it into a wall of light that the contrast solver could only answer by covering everything in grey. It remains the studio's own default, where nothing has to stay readable over it.
Its backgrounds were tuned for the studio's small artboard and then reused across the entire window, where the same code was painting over eight million pixels a frame on a wide display. They now render to a budget — measured at 56% fewer pixels, with nothing visibly different about them.
The download is no longer a crawler's thumbnail. It is a poster of the scene, its palette, and every value in it.
A 1080×1350 portrait: the study's own picture across the top, the palette beneath it as five full-height chips with their names and hex, and the reconstructed gradient closing it. The card's background is that study's darkest tone, so every one of them looks like the place it came from.
The dialog shows the actual card, and the download rasterises that very element — the two cannot drift apart. It also means the card is written in plain CSS now, which is why it can carry a photograph at all.
Every downloadable card, and every study's link preview image, had been missing since they shipped — the pages were built for all three languages but the images for none. Only the development server, which renders them on demand, had ever made them look fine.
A maintenance release: the share cards' font budget is no longer nearly spent, and the framework moved to Next.js 16.3.
Every card had been carrying both the Chinese and the Japanese fonts — 92% of the image renderer's budget at thirty studies, a ceiling the next batch would have hit. Each card now loads only its own language's glyphs, so adding studies in one language no longer weighs down the cards of the other two.
The framework underneath moved up a version: repeat builds reuse unchanged artifacts, and pages are served with more headroom.
Ten new studies in all three languages, and every control that changes what you see now says what it does.
«Falloff» and «Mid bulge» are not names anyone can act on, so they now come with a sentence — as do the colour-family filter, the ring on the core swatch, and the four readings in the landing preview. A dotted underline marks anything that has more to say, and the explanation is reachable by keyboard, not only by mouse.
The library reaches thirty. Among them: a horizon that jumps lightness and chroma on the same line, a crystal that rotates hue rather than darkening at its base, an interior whose entire colour is borrowed through two openings, and a frame containing not one warm pixel that still reads as deep space.
They had been hardcoded English since the knobs were built. So had "Reset to defaults".
Hue is an angle, so 350° and 5° average to 177° — which is how the red band came to be reported as a number outside itself. No published study had quoted one of those figures; the fix is so that none ever does.
Five new studies in all three languages — and the tooling that caught seven numbers the earlier drafts had wrong.
Chosen by measured difference rather than fame: the Inverted City, where lightness has 12 points of range left and chroma takes over; Coatepec Mountain, whose cliff carries the sky's opposite hue inside itself; Salacia Plain, where water filters all but 106 warm pixels out of the frame; Hiisi Island, which rations white to its brightest 4000 pixels; and the Tomb of Carouses, where climate turns out to be decided by lightness, not saturation.
Hiisi Island brought it, with its official names from the wiki — 挪德卡莱 and ナド・クライ — like every other name here.
A measurement bench now supplies every figure a study quotes, and it overturned seven of this batch's drafts — including an ember swatch that rendered as brick red, a claim that flipped depending on how large the sample was, and a “brightest thing in the frame” that was the game's own watermark.
88 assertions in CI, including one named test for each of the three bugs that shipped in v0.9.0. They assert what cannot be true rather than snapshotting what happens to be true, and they sweep every published palette — all three original bugs were invisible on synthetic input.
Every study has a share card built from its own palette, and the site finally has a sitemap.
Its own gradient, its five colours with their hex, the title and the site name — in whichever language you are reading. The most honest thumbnail this project could have: the card is the thing the page is about.
The export section ends with a download button, and the file arrives named after the study.
Every page lists its three translations, and Chinese — the unprefixed one — doubles as the default for anyone else.
It falls back to the deployment's own host first. Forgetting the variable used to mean localhost URLs in the sitemap, which is not the kind of mistake a preview shows you.
All fifteen studies are translated, and every asset now carries its official in-game name in Chinese, Japanese and English.
All fifteen, cross-references included. Translations carry prose only — every measured number stays in the Chinese source, so a translation cannot drift one, and a translation that loses a point fails the build.
璃月港, 稲妻城, and the wiki's own English titles instead of file names — 306 assets regain their punctuation, like “Abyss Herald: Wicked Torrents”. Searching any of the three names still finds the picture.
安柏 · 100%侦察骑士. A skin used to inherit only its character's name, leaving two different pictures with one caption — that was happening to 56 assets.
Four Adventurers' Guilds really do share one official name, so each now says which nation it is: 冒险家协会(枫丹).
Chinese, Japanese and English across the whole site, with a globe in the header to switch. The filters also moved behind a single icon, and colour families now show their colour.
Every page renders per language and Chinese URLs are unchanged — /ja and /en carry a prefix, a first visit follows your browser, and switching language keeps you on the page you were reading.
The gallery and the studio's asset panel both collapse their chips into a tuning icon with an active-count badge. Every group starts with a real “All”, and each colour family carries a swatch of itself.
The analyses and swatch names are content rather than chrome: an English reader gets an English frame around the Chinese study until the translations land, batch by batch.
404 and crash screens were still speaking template English; they were the first thing a message catalogue fixed.
Every asset now carries its official Chinese and Japanese name, the whole library filters by colour family, and nothing on the site is machine-written anymore.
820 assets resolved to their wiki articles; the names are the ones the game itself uses — 775 Chinese, 776 Japanese. The fetcher audits the hand-written studies against them, and its first run caught a placeholder: the study said 奥奇卡纳特兰, the game says 奥奇卡纳塔.
璃月港, 稲妻城 and Liyue Harbor all find the same picture, and region chips appear wherever a category actually has regions.
Every asset's palette is measured and classified into one of nine hue families, weighted by how much of the picture each colour covers — a sliver of accent cannot outvote the sky. The weighted classifier independently calls the Hadramaveth desert purple, the same verdict the written study reached.
The toggle, the generated detail pages and the badges are gone; every study on the site is one someone stands behind. The measured palettes stay in the repository as the colour filter's index — and as the list of scenes still waiting for a written study.
The gallery goes back to quality: fifteen studies someone stands behind, a written standard for what earns a place there, and filters to find your way around.
Six criteria with the question each has to pass. Every number in the new studies is measured, and several cite each other — Mondstadt runs Liyue Harbor's formula and shows identity lives in a 40° hue step; Vanarana is the counter-theorem to Dragonspine.
The 169 machine readings move behind a toggle rather than being deleted — measured palettes are still a useful index, and the colour filter works across all of them.
Name search in Chinese or English, region chips, and colour-family chips. All client-side over data built at compile time.
Layering the photo under the gradient showed neither — Liyue Harbor's entire warm city vanished into teal. Now the hero shows the artwork clean and the gradient gets its own annotated band, with every stop marked.
The authored angle follows each picture's structure, which on a card reads as horizontal banding. Cards now share a 135° sweep; the band uses 90° to match its ruler; hero and exports keep the authored angle.
The scene files are read from disk rather than imported, so the loader's cache pinned the list at the dev server's first render. It took losing three finished studies to notice.
Every scene picture now has a colour study written about it — and every generated one says plainly that it was measured rather than written. The bento's border became a travelling highlight, and the preset list got shorter and better.
Five hand-written studies against 179 pictures; the other 174 now have one too, measured from their own palette — hue relationship, lightness key, whether hue rotates with lightness, and which pairs can carry text.
A badge on the card, a badge on the hero, and a note above the analysis rather than a footnote below it. A generated study reads the numbers; it cannot see that the gold appears only on architectural trim. Hand-written studies still win, and sort first.
As an icon beside the changelog. It stays marked while you are reading a study.
A conic arc lights about 44° of the rim at a time, one pixel wide, centred on the pointer's angle and gliding rather than jumping. The rim is painted with the palette itself, anchored to the viewport, so all the cards sample one shared sheet of light.
Three of the four gradients are parked — they were all the same idea and lost to Linear Blend. Light Tunnel, Light Pillar and Orb can host a landing page again, now that text on the background carries a shadow.
A split-complementary analysis quoted the hue spread as if it were the distance between the two most opposed hues, claiming impossible 195° oppositions. Hue drift was thrown off by a single accent from another hue family, so it reported no direction for exactly the palettes whose drift is the point. And a gapped lightness rhythm hid the key.
A look can now leave the tool as a prompt, a spec, CSS variables, a Tailwind theme, an SVG or Figma tokens — and you can keep the ones you like.
One look renders six ways: prompt, JSON spec, CSS custom properties, a Tailwind v4 @theme block, a standalone SVG gradient, and Figma / Tokens Studio JSON.
Five hex values leave a model to invent its own layout and contrast choices, so this one states the accent, the solved text color and the background dimming as settled facts. Where the background is a program rather than a stylesheet, it says so and ships the derived gradient instead.
Bookmark a look and it returns complete — palette, background, every knob you moved, and the copy. Kept in this browser only; no account, nothing uploaded.
The palette bar gained a format menu with the same four token formats, so getting more than a hex list no longer means opening the preview.
A swatch painted one color while its label and its copy button handed out another. The values are now derived from the authored OKLCH rather than typed a second time.
The generated page now rises over the studio and folds away again, its glass actually lets the background through, and the feature row became a bento that answers your cursor.
The preview lifts over the studio instead of navigating away, covers the site header the way a real landing page would, and closes with Esc.
How much cover a pane needs is worked out from your palette, so over a dark one the background reads straight through the blur instead of hitting a near-solid panel.
A spotlight follows your cursor across the grid and each card lights its own rim. Two of the cells are built from your palette — the swatches, and what the colour maths makes of them.
The headline cycles through words, each in a colour taken from the artwork.
The background stays put while the page scrolls past it.
The point of extracting a palette used to end at copying hex values. Now it builds a landing page — dark, glass-panelled, with your artwork's background and accent — and tells you why the colors work.
Send any palette to /page and get a real page: nav, hero, feature cards, footer. One layout, held still on purpose — the background, the accent and the words are what change.
The panel behind the content is darkened by exactly as much as the text needs to stay legible, and the button label flips between black and white depending on how light your accent is.
Hue relationship, lightness rhythm, saturation and every pair's contrast ratio — the explanation that previously existed only for five hand-written scenes.
The panes were not actually blurring what sat behind them.
Scenes were the thin category — two of them against 641 cards and portraits — and they are the ones worth studying, because a landscape's palette isn't dominated by skin tones. There are 179 now.
Named landmarks and vistas from every region, at 16:9 and full resolution, picked out of the wiki's 1236 location images.
The selection is three reproducible filters rather than a hand-made list, so when a new region ships, its scenes arrive with it.
Background presets are no longer fixed — the ones that have knobs expose them as sliders, so you can push a gradient's contrast, pin it to a single hue, or thin out a speck field without leaving the studio.
Linear Blend, Radial Mesh, Radial Mesh Animated and Grain now open a Tune panel — from the knob button on their card, or the toolbar toggle.
Contrast, Hue travel, Saturation, Key and Mid bulge push the palette-derived ramp around without discarding it — the palette still drives the color, the sliders only say more or less.
Dragging a slider repaints the artboard immediately instead of cross-fading it, and Reset puts a preset back to exactly what it looked like before.
The repository stops introducing itself as a starter template, and the fan-project terms are stated on every page rather than only where the footer happened to reach.
The non-commercial fan-project notice now appears on the studio too — it previously showed only on pages that have a footer, which left out the front page.
The code is MIT; the Genshin artwork is HoYoverse's and is carved out explicitly, spelled out in the LICENSE file.
Both language versions were rewritten around this project instead of the template it grew out of.
The page declares Chinese, so assistive tech stops reading it with an English voice.
The artboard commits to its black ground, and the project's roadmap and feature ledger now live in the repo.
The black/white ground toggle is gone — every background preset is designed to read against black, and the white ground washed most of them out.
A machine-readable inventory of every shipped and planned capability joins the repo, alongside a roadmap rewritten against the product as shipped.
The asset shelf goes from 8 images to 643 — every character splash art, TCG character card, and namecard in the game, ready to pull a palette from.
146 character splash arts, 216 Genius Invokation TCG character cards, and 279 namecards join the picker.
Namecards now carry their real in-game titles — the one labelled "Citlali" is "Citlali Opalstar".
Gradient backgrounds now design a ramp from your palette instead of blending it straight through — plus two new backgrounds, Linear Blend and Light Tunnel.
Radial Mesh, its animated twin, and the new Linear Blend keep your palette's hue relationship and overall key, then rebuild lightness and saturation so mid-tones stay vivid instead of sliding toward grey.
Your palette as one smooth diagonal ramp, sitting first in the picker.
A wall of fiber-optic strands bending up out of the floor, with light pulses racing across the near ground and slowing as they climb.
Two new hover-reactive backgrounds — X Grid and Grain — plus Lightfall and Orb rebuilt so they finally paint from your palette instead of their own colors.
A dense field of × marks breathing on a slow diagonal wave; they brighten toward your cursor and link up into a temporary mesh.
A fine scatter of specks that lights up around the cursor, with hairline links between close neighbours.
Rebuilt from scratch: the blue haze behind the streaks is gone and the stars fall straight down at their own speeds instead of fanning outward.
Its ring gradient is now mixed from your extracted palette rather than a rotation of a fixed purple and cyan.
Moving the cursor off the artboard now drops only the gravity well — the grid itself stays visible.
Three shader backgrounds from Paper — Dot Orbit, Voronoi, and Pulsing Border — plus a fix so the Warp Grid focus tracks your cursor exactly.
Dot Orbit, Voronoi, and Pulsing Border join the picker, each painting from your extracted palette over a transparent ground.
The gravity well now lives only under the cursor — it follows while you hover and disappears the moment you leave the artboard.
The workbench turns into a pannable, zoomable canvas with floating panels you can drag anywhere, joined by a fresh crop of palette-driven backgrounds.
Pan and zoom around a framed artboard, and drag the asset and background panels wherever you like — a top toolbar zooms, resets the view, and flips the artboard between black and white.
A faint grid pinched toward a glowing gravity well that follows your cursor, its nodes lit in the palette's core color.
Ripple Grid, Letter Glitch, Orb, Dot Field, Aurora, and Soft Aurora join the roster, each painting from your extracted palette.
Backgrounds render at native resolution again (no more grain), Silk's noise is off, resting borders are gone, and dark-mode panels read clearly over any animation.
Switching away from Ripple Grid no longer breaks the artboard.
Eight React Bits backgrounds join the preset roster, the palette learns what its core color is, and a big performance fix makes everything smooth.
Liquid Ether, Ferrofluid, Lightfall, Dark Veil, Light Pillar, Silk, Floating Lines, and Side Rays — each painting from your extracted palette.
Extraction flags the palette's strongest voice; it drives hue-based presets and seeds the color picks for everything else.
Hide every panel with one click and enjoy the canvas full-screen — Esc brings the tools back.
Near-white and near-black areas (card frames, dark skies) no longer waste palette slots, and the bar can copy all hex values or a CSS gradient at once.
Animated backgrounds now render at native 1x resolution instead of Retina 2x, removing the page-wide lag on large screens.
The template becomes a product — a fan-made studio for learning color design from Genshin Impact art, with a background workbench at its heart.
Pick a Genshin asset and its extracted palette drives a full-screen animated background — switch between linear, radial-mesh, and drifting-mesh presets.
Five swatches are clustered from the picked image right in the browser (OKLab k-means), shown in a click-to-copy palette bar.
Scene, character, TCG-card, and name-card categories with smooth virtualized lists, thumbnails, and a full-size preview dialog.
Five hand-tuned Teyvat scenes with gradient heroes, color analysis notes, and CSS / Tailwind / SVG exports — each scene re-themes the page from its own palette.
Dark-by-default deep grey-blue tone with film grain and display serif headings; template demo pages are gone.
The dashboard grid gains a Customize toolbar and cleaner, unified chrome — powered by a reusable grid board under the hood.
Show or hide each dashboard widget and reset the board back to its default arrangement.
A themeable corner resize grip, standard card surfaces on grid widgets, and no more drag icon cluttering the top-right corner.
All grid behavior now runs through one reusable board component, so every grid page shares the same look and feel.
A groundwork release — validated configuration, a CI gate on every change, and polished error states across the app.
Consistent 404 pages inside and outside the shell, an error screen with one-click retry, and a loading skeleton while pages stream in.
Environment variables are checked against a zod schema at startup, so a bad config fails the build instead of surfacing at runtime.
Every push and pull request now runs lint, type checks, and a production build on GitHub Actions.
The first cut of the template — a themeable Next.js dashboard shell with a live settings drawer, ready to build on.
An app shell with vertical, mini-rail, and horizontal nav layouts, Priority+ overflow for the top bar, and a small-screen drawer.
Live theme controls — light/dark/system, contrast, compact density, nav layout and color, color presets plus a custom brand color, radius steps, a font picker (Outfit by default), and a max-width toggle — persisted across reloads.
Card and overlay elevation, chart series, and borders all run on design tokens, so presets and contrast re-skin the whole app consistently.
An analytics dashboard, line and bar chart pages, a drag-and-resize gridstack board, avatar fallbacks, and a display-card gallery.
Iconify-compiled Solar duotone glyphs across nav, settings, and headers.
Curated release notes on a timeline, rendered from a typed changelog module.