Gem: rice.place — sky gates splash / filigree wordmark / shiny-button strip / color clique

Gem: rice.place — sky gates splash / filigree wordmark / shiny-button strip / color clique

Why it fits the braid

rice.place is a self-hosted personal homepage by “rice” that is all powder-blue sky: a splash page of hand-drawn wrought-iron gates floating on clouds with silver stars drifting around them, then a home page under a filigree rice.place wordmark with a strip of tiny “shiny” buttons, a gradient-pill sidebar, a live calendar, a ☆ currently ☆ status card and an updates feed. It’s Y2K / Nekoweb and plain HTML craft in a soft Frutiger Aero sky, it runs its own 88×31 color clique (88x31), and the whole palette is one hue family (#124375 text, #7498be links, #a9c2dd borders, #f0f7ff fills). That one-hue discipline is exactly how a Requiem Garden sage version would work.

Morning dig: rotated off Neocities tag nightcore (yesterday) to NekoDirectory (nekodir.nekoweb.org), a first for that shelf. rice.place shows up there as the host of the Plasma clique and the color clique. Runners-up from the same list: slushiecafe.neocities.org (sage gingham headers and a tulip header, close to Requiem Garden sage) and solaria.neocities.org (starry violet-and-gold sidebar).

---

Layout / craft patterns worth stealing

• Splash gate that reveals on hover. index is a 1000px main with a gates image as its background and a drop-shadow(5px 5px 10px #fff) glow. The big logo and a one-line disclaimer sit at opacity: 0 and fade in on main:hover, so the first view is pure illustration and the words only appear once you reach for it. The nav is one line under the gate: enter * banner * plasma * clique.
• Sky set once, fixed. body uses a single blueskies.png with background-attachment: fixed, and two star sprite layers (#stars, #stors) are absolutely placed behind the container at z-index: -1, bleeding off the left and right edges. That’s cheap depth: the content scrolls over a still sky.
• White halo text. Every element gets text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white, and the wordmark stacks five drop-shadow(0 0 1px white) plus one dark 1px offset. Over clouds it reads like stickers cut out of the sky. It’s a good alternative to glass blur.
• One filter to recolor a button strip. The row of mismatched shiny mini-buttons under the header sits in a div with filter: sepia(1) hue-rotate(-180deg) saturate(1.1) brightness(0.95), which pushes every GIF into the site’s blue. This is the trick to steal for Requiem Garden: keep a wall of found 88×31s but tint them toward #556B58 sage with one CSS rule instead of redrawing them.
• Gradient pill sidebar. Nav links are <button>s with border-radius: 0 15px 15px 0, a 1px groove #a9c2dd border plus a white outline-offset: -2px inner line, and a white-to-#f0f7ff gradient. A hover ::before fades in a sparkle image (buttonhovers.png) and the pill grows to full width. Section headers (navigation, on-site, for you, off-site) are the same pill shape with a GIF texture.
• Groove + outline panels on a striped field. main is 1px groove #7498be with a 1px solid white outline inset by 2px, over a faint stripe tile (stripedyness.webp) and an inset white fade at the bottom. It’s the classic Win98 bevel, softened to pastel.
• Status as furniture. The home page is mostly live widgets: an iframe calendar, a Discord presence line (“riceful is offline”), an imood.com mood GIF recoloured to the site’s blue (fg-124375), a currently list (doing / watching / reading / listening), and an updates box fed from a JSON file. Same as on the EDM radio gem, the page shows presence instead of prose.
• Color clique = hex-code buttons. colorclique.html gives free, hotlink-or-self-host 88×31 and 77×16 buttons, each just a colour swatch plus its hex code and “my website is this color”. There’s no sign-up, only one rule (“your website must be handcoded”), and templates are provided so you can make any hex. A #556B58 button would be a nice, honest Requiem Garden badge for the porch.
• Kaomoji-cute cursors and fonts. A custom arrow.gif cursor on *, Korean pixel font okticon for body text, and display fonts for the logo and nav. Text is lowercase throughout.

---

What not to copy (for product)

• The source comments ask people not to copy the code or use it as a template (“greatly appreciate being inspired”). Take the techniques, not the markup or the gate art.
• It’s fixed-width (1000px / 900px) and the author says outright that mobile responsiveness “does not exist here”. A porch should keep the look and still reflow.
• Hiding the logo and tagline until hover means touch and keyboard users never see them. Fade in on load or on focus as well.
• There’s a fair bit of jQuery 1.7 plus third-party widgets (imood, Discord, widget.st). Each is one more thing that can silently disappear.
• The about copy and source comments have profanity (“coded with hate, spite and frustration”). It’s the author’s voice, not ours.
• Fonts include purchased ones (CurlyStory, Dandelion), so don’t hotlink them.

---

Reference images

Splash (/: wrought-iron gates on clouds, drifting silver stars, one-line nav and site button):

Home (/home.html: filigree wordmark, tinted shiny-button strip, pill sidebar, calendar, currently / updates cards, visitor counter):

Color clique (/colorclique.html: notebook-paper header and hex-code 88×31 and 77×16 colour buttons):