AI Web Style — gallery · motion · prompts

Style is a decision, not a mood board.

Every style here is broken down to the rules that actually do the work, then rendered on one identical page — so you compare stylesheets instead of screenshots. Motion patterns come with working demos; page prompts come with the section order and the ways each page type fails.

Rendered in a style picked at random

Skeuomorphism · Swiss Style / International Typographic Style · Grunge Style · Modern Tech Style · Brutalism · Retro - 90s Web · Retro - Y2K Aesthetic · Retro - Pixel Art · Illustration Focused · 3D Elements / Interactive · Dark Mode · Bold Typography · Glassmorphism · Aurora UI · Natural / Organic Style · Monochromatic Design · Maximalism / Collage · Claymorphism · Abstract / Geometric Shapes · Sustainable / Green Design · Art Deco Style · Neomorphism · Bento Grid · Liquid Glass · Editorial / Magazine · Neo-Brutalism · Neo-Swiss · Acid Graphics

The library

  1. 01 Styles Design directions with tokens, typography, layout rhythm and the failure cases that decide whether one survives a real page. 28 styles
  2. 02 Previews Every style rendered on one identical page, so the only variable is the stylesheet. 28 pages
  3. 03 Compare Two styles, two live panels, one decision table — for a choice you are about to make. 20 comparisons
  4. 04 Motions Animation patterns with a working demo and a prompt precise enough to build them right the first time. 12 patterns
  5. 05 Prompts Whole-page prompts: section order, the variables worth changing, and how each page type fails. 12 recipes

Start here

  1. Pick a direction. Read what a style actually is — its tokens, its typography, the layout rhythm it forces — and where it stops working. Compare the styles
  2. See it on one page. The same markup, the same sentence, a different stylesheet. Two panels side by side if you are choosing between two. Open a preview
  3. Take the prompt. Section order, the variables worth changing, and the four ways each page type usually breaks. Read a recipe

Recently added

Bento Grid

Asymmetric tiles on a shared grid — many features, one calm surface.

Breakdown →

Liquid Glass

Edge-lit glass with refraction — depth without drop shadows.

Breakdown →

Editorial / Magazine

Print hierarchy on screen — serif display type, measured columns, real whitespace.

Breakdown →

Neo-Brutalism

Thick black edges, offset shadows and saturated pastel fills.

Breakdown →

Neo-Swiss

Strict modular grid, variable weight, one red accent.

Breakdown →

Acid Graphics

High-saturation fills, warped type and anti-design energy.

Breakdown →

All styles →

What this is, and what it is not

Most galleries show a mood board. That does not answer the only question a builder has.

Most style galleries show a mood board or a screenshot of somebody else's site. Neither answers the question a builder actually has: what does this style look like when it has to hold a headline, three columns, a paragraph and a call to action at the same time — and at 390 pixels wide?

So every entry here is verified against a page that exists. The previews are real HTML rendered with different stylesheets, the motion patterns are working demos rather than videos, and each prompt is written against the CSS that produces the result. Where a style has a known failure — a contrast problem, a layout that collapses at a breakpoint, a technique that drops frames — the page says so.

It is not a template marketplace and it does not sell placement. The prompts and stylesheets are free to use, and the site earns its keep from advertising that never appears on the demo pages themselves.