Delicious

How cocktail.glass was built agent-ready from the first commit: one data source, Markdown negotiation, a stateless MCP server, and discovery.

Every view-transition-name on a page must be unique. The problem is that every pseudo-element selector in your CSS targets a specific name, so your animation styles explode into an unmanageable wall of selectors.

Fulldev UI ships open-source Astro UI components and blocks that developers and AI agents can use to build content-driven Astro websites.

Add a fancy underline to your menu items using modern CSS

Search a curated DESIGN.md library for AI agents: colors, typography, spacing, and component patterns from top websites.

Griddy Icons is free open-source icon family with unique utilitarian vibe

Declarative audio synthesis for the web.

Turn any SVG into interactive 3D objects. Animate and export as 4K image or video. 100% free, no account or subscription needed.

Drag, lock, shuffle, share. A small opinionated colour palette tool.

HyperFrames lets AI agents compose videos by writing HTML, CSS & JS — originated by HeyGen, built for the community. Open source under Apache 2.0.

Why AI depends on the foundation accessible design systems build — and how "AI will fix accessibility" is producing the opposite outcome at industry scale.

Who knew the back button could break dark mode?

Use clip-path: shape() to create a lot of CSS-only fancy frames. Get an optimized & modern code in no time.

Replace port numbers with stable, named .localhost URLs. For humans and agents.

How do you make 3D-glasses-like graphics in the browser? We'll look at how blend modes work together to create this effect.

Most grid layouts sit in neat rows, perfectly aligned, like soldiers in formation. But sometimes you want something with more rhythm like, say, a zigzag pattern. Here's how to do it with CSS Grid.

...

The new Animation Timeline API allows us to create dynamic scroll animations without any JavaScript! It’s honestly a very lovely API, and in this blog post, we’ll explore some of the super cool things we can do with it.

An interactive story about the birds that capture our curiosity, told through data, visuals and illustrations

Elena is a simple, tiny library for building Progressive Web Components.

EZ-Tree is a procedural tree generator that allows you to create realistic 3D models of trees with ease.

Eric Bailey teaches us how to make a hyper-resilient component that responds not only to the container, but other languages too.

Generate Tailwind colour scales

Free slit-scan art creation tool. Works in your browser and on your phone. Distort, warp, and drag images, text, and selphies with this tool that simulates moving objects on a flatbed scanner.

Let's take a look at what SVG filters are and the basics of how they work.

Splendid Labz is a software development company that builds for Astro users

When migrating from WordPress to Astro, one encounters various challenges.One is handling the WordPress "More" tag, which originates from the More Element in the WordPress Block Editor. After converting the WordPress export to Markdown, you will find `` tags in your content. These tags serve as delimiters in WordPress, allowing you to define

Learn CSS scroll animation with interactive examples. Compare approaches with copyable code.

A spatial design tool where everything renders as Unicode box-drawing characters. Share as text.