Take the homestead with you

Build me a complete, responsive business website in the GEOCITIES style — the joyful amateur maximalism of a 1990s personal homepage: a tiled starfield wallpaper behind a fixed-width, hard-bordered table-style content column ("a page inside a page"), a scrolling marquee banner, a ticking hit-counter, an Under-Construction badge, rainbow divider bars, a guestbook, and a Prev/Random/Next webring strip at the bottom. Everything is flat color with hard 2–3px borders — pride of ownership over polish, "I made this and it's MINE." Combine this style seed with my brief below. If I don't give you the details, invent a plausible business that suits this nostalgic, hand-made look — a retro arcade, a hobby shop, a fan-club or zine, a novelty snack brand — and build a full, real demo for it, not a placeholder. This style is a FAMILY, not a single template — the same seed should produce visibly different sites for different businesses. A few dimensions flex: the exact ACCENT hues within the period palette, the TYPE pairing, and the overall LAYOUT ARCHETYPE. Pick one of each that fits my brand and COMMIT to it across the whole site — every option below is equally on-style, so trust the choice. ── INVARIANTS (never break these — they define the style) ── • A TILED, repeating texture wallpaper (starfield, marble, stars-on-dark) behind everything, with a fixed-width, HARD-BORDERED table-style content column centered on top — the "page inside a page." The contrast of ordered column over chaotic wallpaper is the signature. • Flat color with HARD 2–3px borders and flat (non-blurred) offset shadows only. No soft shadows, no gradients-as-depth, no smooth modern rounding. • The signature widgets, used unironically and for real: a scrolling MARQUEE banner, a ticking HIT-COUNTER odometer ("You are visitor #001337"), a striped UNDER-CONSTRUCTION badge, a rainbow gradient DIVIDER bar between sections, a GUESTBOOK block, and a Prev / Random / Next WEBRING strip in the footer. • Loud clashing color — two saturated accents fighting for attention, rainbow-colored accent words, browser-default link blue and visited purple honored on links. • Motion is "scroll": flat, constant, looping horizontal/vertical motion only — the marquee scrolling, the hit-counter ticking up, a webring banner cycling. Never an eased fade, spring, or smooth crossfade. Honor prefers-reduced-motion (pause the marquees/counters to a static frame), and keep ALL content visible without JavaScript. • CONTRAST (WCAG 2.2 AA, non-negotiable): every text/background pair is ≥4.5:1 for body, ≥3:1 for large/headline text. The joke is EVOKING the clash without literally failing — so real body copy is an OFF-WHITE (not thin) on the dark tiled ground, near-black on any light panel, and rainbow accent words stay large/bold enough to clear 3:1. NEVER thin saturated text as small body copy on a busy tile, and NEVER white on yellow. ── VARIABLES (choose one of each that fits my brand, then commit) ── • PALETTE — a dark tiled STARFIELD ground (near-black, starfield-purple) with an OFF-WHITE foreground for legibility, plus TWO loud clashing accents. Bring my brand hues if I give them, pushed loud and saturated; otherwise the period-classic hot magenta + electric cyan. The accents may flex — acid green, signal yellow, hot red, gold — but keep them saturated and clashing, with a bright border color (yellow or cyan) on the table blocks and browser-default blue/purple on links. Keep the clash; never a single calm muted color. • TYPE — one casual/rounded display + one plain serif body, via Google Fonts. Display, pick one: Comic Neue · Fredoka · Baloo 2 (the friendly "Comic Sans" register). Body, pick one Times-style serif: Tinos · PT Serif · Gelasio. Rainbow-color individual accent words where it fits. • LAYOUT ARCHETYPE — choose one structural feel and commit: a single centered table-column homepage with stacked bordered sections; a two-column table with a nav/links sidebar and a main content pane; a "neighborhood" index of bordered tiles linking out; a fan-shrine of stacked bordered panels heavy with badges; or a guestbook-and-links-forward layout. Keep the page-inside-a-page and the widgets in every archetype. Also settle on your own tile texture and border color. ── MEDIA MODEL (clip-art and widgets, not stock photography) ── Build most visuals from CODE and period furniture: bordered table panels, rainbow dividers, badges, the hit-counter, the marquee, the webring strip, and simple flat clip-art-style marks (a spinning star, an animated "NEW!" tag, a construction cone). Where the business genuinely needs a photo (a product, a space, the team), place a real placeholder <img> inside a hard-bordered table cell with a flat offset shadow, never full-bleed and never rounded. Do NOT fake a photo with a plain colored div where an image belongs — use a placeholder image. Generate marks and imagery appropriate to MY business, not a reuse of any demo. WHAT THIS SITE MUST ACHIEVE (business goal): Make it instantly clear who this business is and what it offers, with all the homemade charm but a message a stranger can actually follow; build a little trust and real proof (what it is, who it's for, hours, prices, names — whatever is true); and drive one clear next step — a visit, a call, an order, a signature in the guestbook. Let the business and its brief decide which sections serve that goal, include exactly those in a sensible order, and build each one fully. BUILD REQUIREMENTS — ship a complete, usable site, not a hero mock: • Real information architecture driven by MY business and goal — whatever sections move a stranger toward acting, each in its own bordered table panel with one clear job, in a sensible order. Include working navigation and a webring/guestbook footer. • Don't be lazy with any section: each carries real content depth (never a title plus one thin line), proper hierarchy, and the full geocities treatment — tile, borders, a divider, the right widget. If a section only serves the style, cut it; if a section serves the goal but feels thin, flesh it out. • Real, tailored copy for MY business — enthusiastic, homemade, proud, but genuinely informative. Never lorem. • Fully responsive and accessible: semantic landmarks, alt text, and the CONTRAST invariant enforced on EVERY section — off-white body on the tile, near-black on light panels, no thin text on a busy tile. On mobile, let the fixed column become fluid but keep the tile, hard borders, and widgets. • Apply the chosen palette, type, and layout archetype to EVERY section, not just the top.

Best for AI website builders — Lovable, v0, Bolt

Restyle my existing site into the GEOCITIES look — the joyful amateur maximalism of a 1990s personal homepage: a tiled starfield wallpaper behind a fixed-width, hard-bordered table-style content column ("a page inside a page"), a scrolling marquee banner, a ticking hit-counter, an Under-Construction badge, rainbow divider bars, a guestbook, and a Prev/Random/Next webring strip. Everything is flat color with hard 2–3px borders. Keep ALL of my current content, copy, pages, and structure exactly as they are; change only the visual language. Do not invent new pages, remove sections, or rewrite my words. Keep MY brand hues — carry my existing colors in as the TWO loud clashing accents rather than swapping in new ones, pushed louder and more saturated. Set them against a dark tiled STARFIELD ground with an OFF-WHITE foreground for legibility, a bright border color on the table blocks, and browser-default blue/purple on links. Keep the clash. Then make one TYPE choice and COMMIT. ── INVARIANTS (never break these) ── • Wrap the whole page: a TILED repeating wallpaper behind a fixed-width, HARD-BORDERED table-style content column centered on top — the "page inside a page." Harden every card and section into a bordered table panel. • Flat color with HARD 2–3px borders and flat (non-blurred) offset shadows only. Strip every soft shadow, gradient-as-depth, and smooth modern rounding. • Add the signature widgets for real: a scrolling MARQUEE banner, a ticking HIT-COUNTER, a striped UNDER-CONSTRUCTION badge, a rainbow gradient DIVIDER between sections, a GUESTBOOK block, and a Prev / Random / Next WEBRING strip in the footer. • Loud clashing color — two saturated accents, rainbow-colored accent words, browser-default link blue and visited purple honored. • Motion becomes "scroll": flat, constant, looping motion only — the marquee scrolling, the counter ticking, a webring cycling. Remove every eased fade, spring, and smooth crossfade. Honor prefers-reduced-motion (pause the marquees/counters) and never leave a section stuck invisible; keep content visible without JavaScript. • Never: a smooth modern centered-grid layout, a single calm muted accent, soft blurred shadows or gradients, or smooth easing in place of flat looping scroll. ── TYPE (pick one pairing to suit my brand, then commit) ── One casual/rounded display (Comic Neue · Fredoka · Baloo 2) + one Times-style serif body (Tinos · PT Serif · Gelasio), loaded via Google Fonts. Rainbow-color individual accent words where it fits. Place any existing image inside a HARD-BORDERED table cell with a flat offset shadow (squared corners, never rounded, never full-bleed); replace soft icons and gradient fills with flat badges, rainbow dividers, and period widgets. Keep it responsive and accessible — enforce WCAG 2.2 AA contrast on every block (≥4.5:1 body, ≥3:1 large): off-white body on the dark tile, near-black on light panels, rainbow accent words large/bold enough to clear 3:1; never thin text on a busy tile, never white on yellow. Restyle what already exists so every section carries the geocities system consistently — same content, new skin.

Paste alongside your existing site/code for an AI coding agent to apply

Design a single section in the GEOCITIES style — the joyful amateur maximalism of a 1990s personal homepage: a tiled starfield wallpaper behind a fixed-width, hard-bordered table-style block, a scrolling marquee, a ticking hit-counter, an Under-Construction badge, rainbow dividers, a guestbook, a webring strip. Everything flat color with hard 2–3px borders. A low-commitment preview of the style, built richly for whatever section I ask for. Tell me in your own words, alongside this prompt, which section you want and the job it has to do — a welcome hero with a marquee, an "about me" panel, a links/webring block, a guestbook, a wares/pricing table, a gallery of bordered thumbnails. If I don't name one, build a welcome hero for a plausible homesteader you invent that suits this style. Whatever the section, build it fully and richly — real, tailored copy, proper hierarchy, and depth, not a title plus one thin line. ── INVARIANTS ── • A TILED wallpaper behind a fixed-width, HARD-BORDERED table-style content block — the "page inside a page." Flat color, hard 2–3px borders, flat (non-blurred) offset shadows only. At least one signature widget for real (a MARQUEE banner, a ticking HIT-COUNTER, an Under-Construction badge, a rainbow DIVIDER, a GUESTBOOK, or a webring strip). Loud clashing color, browser-default link blue/purple. Motion is "scroll" — flat, constant, looping (a marquee scrolling, a counter ticking); no eased fade or spring; content visible without JavaScript, honoring prefers-reduced-motion (pause the marquee). • Never: a smooth modern centered-grid layout, a single calm muted accent, soft blurred shadows or gradients, smooth easing in place of flat looping scroll. ── VARIABLES (pick one of each, commit) ── • PALETTE — a dark tiled STARFIELD ground with an OFF-WHITE foreground, plus TWO loud clashing accents and a bright border color. Bring my brand hues if I give them, pushed loud; otherwise classic hot magenta + electric cyan. The accents may flex (acid green · signal yellow · hot red · gold) but keep them saturated and clashing. • TYPE — one casual/rounded display (Comic Neue · Fredoka · Baloo 2) + one Times-style serif body (Tinos · PT Serif · Gelasio), via Google Fonts. Rainbow-color accent words where it fits. If the section genuinely needs an image, use a real placeholder <img> inside a HARD-BORDERED table cell with a flat offset shadow — never a fake colored div standing in for a photo, never rounded, never full-bleed. Include a loud primary call-to-action or a guestbook-style prompt where the section's job calls for one. Make it responsive and accessible — WCAG 2.2 AA contrast (≥4.5:1 body, ≥3:1 large): off-white body on the tile, near-black on light panels, rainbow accent words large/bold enough to clear 3:1; never thin text on a busy tile, never white on yellow. Write real, tailored copy for the subject, not lorem.

Good for a focused first pass, or a chat-based assistant like ChatGPT/Claude