I Built a Design Skill Because AI Keeps Getting Y2K Wrong
Most AI-generated Y2K design starts with the same shortcut: a purple gradient, a futuristic font, a glow, and maybe a few random sparkles. It looks like a collection of references rather than a design direction.
I got tired of seeing that pattern, so I built a skill for coding agents that treats Y2K as an art direction system instead of a texture pack.
The skill is called Y2K Design Agent. It is a set of instructions, references, and checks that an agent can use when a brief asks for millennium design, chrome, gel, Aqua, cyber-pop, or an early-2000s interface. It works across Claude Code, Codex, OpenCode, Windsurf, Cursor, and other tools that read AGENTS.md.
Start with the era, not the effects
The first rule is to choose one era. The skill separates 1997 Techno-Industrial, 1999 Chrome Orbital, 2001 Aqua Lozenge, and 2003 Plastic Pop. They overlap in time, but they do not have the same materials, type, or attitude.
That choice matters because “Y2K” is usually used too broadly. A black page with neon grid lines is closer to synthwave or cyberpunk. Purple and degraded VHS textures belong to vaporwave. Glossy green nature graphics belong to Frutiger Aero, which came later. The skill makes those boundaries explicit so the agent does not blend every retro reference into the same metallic template.
Materials are not decoration
Chrome is not a two-stop grey gradient. It needs a reflected horizon: a soft bright band, a hard transition, compressed darker ground, and a bounce of light near the edge. Gel needs a body, a specular cap, an internal bounce, and a ring. Frosted plastic needs tint, thickness, and a rim light, not just blur.
The skill also requires grain when material intensity is high. Pure CSS gradients tend to look like vector art. A small amount of texture gives the surface the quality of something rendered, printed, or photographed.
These details sound specific because they are. “Make it feel Y2K” is not a useful instruction on its own. A coding agent needs to know what the surface is supposed to be doing, where the light comes from, and what should happen when the effect is removed.
A control, not an animation
One of the rules I like most is that every project needs one real signature control. It can be a tab strip, a dial, a variant selector, or a slider, but it has to change the product state. A decorative animation is not enough.
That rule comes from how interfaces felt around the turn of the century. The best ones looked like objects you wanted to touch: Winamp had a visualizer, Aqua controls had a physical quality, and product interfaces made the interaction itself part of the experience.
The skill is not asking agents to make a page move for the sake of movement. It is asking them to build one interaction that belongs to the product.
The grayscale test
The most important check happens before the chrome. Remove the effects and look at the page in grayscale. Is there still a clear focal point, a clear hierarchy, and one obvious action? If the design collapses when the shine disappears, the shine was carrying a weak composition.
The same idea appears in the accessibility rules. Material cannot make text unreadable, focus cannot disappear on a chrome surface, and reduced motion needs to leave the control usable. A strong visual direction still has to survive a keyboard, a small screen, and a slower device.
That is the point of the skill. It does not tell an agent to add more retro effects. It gives the agent a set of boundaries that make the visual language repeatable: choose the era, define the material, build the hierarchy, make one control matter, and check what remains when the surface treatment is gone.
The repository is open here: https://github.com/unrealretamal/y2k-design-skill
I built it because I wanted coding agents to stop treating Y2K as a mood board. The future looked better when it had rules.
Try the Y2K Design Agent on GitHub →
