Shaders adds copy-paste web sections for coding agents
By Steven Van ·
Seven prebuilt sections and 20+ new effects, including WebGPU compute-powered ones, land at shaders.com/sections.
Shaders moved up a level of abstraction. Instead of dropping a single effect onto your site, you can now grab a whole prebuilt section: 7 new web sections just landed, each with a copyable prompt you hand to your coding agent to ship in seconds. Pick one, copy, paste, done.
From effects to sections
Until now Shaders gave you components, a Liquid Gradient here, a Logo effect there, that you composed yourself. Sections package that composition: a hero, a feature block, a call-to-action already built around the shader work, ready to drop into a page. It's the difference between selling paint and selling a finished wall. For anyone assembling a landing page, that's a much shorter path from "I want something that looks alive" to a section that does.
Built for the agent workflow
The delivery mechanism is the tell: each section comes as a prompt, not just code. You copy it, feed it to your agent (Claude Code, Cursor, whatever you build in), and it ships the section into your project. Shaders is meeting the reality that a lot of front-end work now happens by describing intent to an agent rather than hand-wiring components, so it ships the intent pre-written. Copy the prompt, ship it in seconds is a workflow claim as much as a design one.
20+ new compute-powered effects
Under the sections is a bigger release: 20+ new effects, including compute-powered ones like ParticleField and InkFlow. Compute-powered is the key phrase, these run on WebGPU compute shaders, which is what makes dense particle systems and fluid ink simulations viable in a browser at 60fps. It builds directly on the Shaders v3 engine that shipped earlier this month claiming up to 25x faster rendering; that speed is what lets a whole section full of live effects stay smooth.
Try it
The new sections and effects are live at shaders.com/sections. The fastest test: pick a hero section, copy its prompt into your agent, and see how close the shipped result is to the preview, that copy-to-shipped gap is the whole pitch.
Sources: Shaders on X, Shaders.