Imported library
3427 items in the library.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages. Sign in
Kind (shader, button)
Style (gradient)
Licence
- Subscription
Abstract glassy shader
Shader
GLASSWORKS — a drop-in WebGL2 metaball field (two SDF circles fused with a smooth union, an exponential glow and a cosine spectrum) integrated into shadcn `components/ui` and framed as a glass component lab: a live telemetry HUD reading the shader's own blob centres/FPS/clock, a control deck of faders that promote the baked-in constants to live uniforms, copyable source tabs, and a props/uniforms API; fully procedural with a CSS metaball fallback.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Aether flow shader
Shader
Faithful shadcn integration of the **Aether Flow** component — a procedural fractal-noise (fBm) gas rendered on a single full-screen Three.js quad — framed as an *atmosphere synthesizer* console: a left instrument rail of five faders (Hue/Speed/Intensity/Complexity/Warp) wired straight to the shader's `u_*` uniforms, a named patch bank (Nebula/Ember/Abyss/Drift/Solar/Bloom), pointer-driven warp, and a live telemetry strip reading the field's per-frame state back out; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Animated shader background
Shader
"AnoAI" product hero set over a full-viewport three.js aurora fragment shader, integrated as a shadcn `components/ui` piece, with a graceful CSS-aurora fallback when WebGL is unavailable, vendored Geist font + generated avatar art, and a headless screenshot-based shader verification.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Aurora borealis shader
Shader
"Aurora Watch" field-station console wrapping the brief's verbatim Three.js aurora-borealis shader (an FBM-noise green→violet curtain with a cursor-tracking flare) as a shadcn `@/components/ui` drop-in — a probe reticle tracks the flare as geomagnetic lat/long, and the signature Kp-index gauge (0–9) is driven by the aurora's brightness sampled straight off the GPU, with a CSS-aurora WebGL fallback and fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Blue meshy shader lab
Shader
Faithful shadcn integration of the verbatim WebGL2 "blue meshy" background — a procedural domain-warped fractal-noise (fBm) sea on a single full-screen quad, transparent-compositing through a 20-step blue palette — dropped into `@/components/ui` and framed as a component lab: the live shader as a full-bleed `min-h-screen` hero carrying the shipped "Turning Ideas Into Impact" lockup, then a setup guide, anatomy, a props + shader-constant reference, and a usage gallery; the only deltas to the verbatim file are a valid `join(", ")` and a `cancelAnimationFrame` cleanup for StrictMode safety, fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Blueprint ascii grid shader
Shader
"GRIDLINE" shadcn-style integration of the brief's verbatim WebGL2 `asd.tsx` — a deep-navy four-point mesh-gradient blueprint grid with ASCII glyphs stamped on the major intersections, drift, vignette, value-noise grain and Bayer dithering — dropped into `@/components/ui` and framed as a live instrument: a telemetry HUD (iTime/FPS/iResolution/iMouse), a control deck promoting the shader's baked constants to live uniforms, a per-pixel anatomy walkthrough, and a full shadcn/Tailwind/TS integration story; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Celestial ink shader
Shader
Verbatim Three.js "Celestial Ink" fragment shader (a rotating six-octave fBm ink field, plum→magenta→gold, that ripples around the cursor) dropped into shadcn `@/components/ui` and framed as an inkstone scrying instrument — a cursor-following astrolabe reticle sights the ripple, a telemetry column reads the shader's own per-frame state (ink time, rotation, ripple coords, fps), and freeze / drift / ripple controls drive the pass; Cormorant Garamond / Inter / JetBrains Mono vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Crystal voronoi shader
Shader
Shadcn-style integration of the prompt's `crystal-shader` (`InteractiveShader`) — a raw-WebGL two-pass warped Voronoi lattice with a cursor repel field, ported to TypeScript and framed as the "Cryolite Lab" crystallography specimen station: a caliper-framed full-viewport shader with a counter-rotating goniometer reticle, live GPU telemetry (FPS, centre-pixel luminance + spectral cast read via `gl.readPixels`), and four calibration faders wiring the brief's `cellDensity`/`animationSpeed`/`warpFactor`/`mouseInfluence` props to live uniforms; zero runtime libs (raw WebGL, no three.js), fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Fluid swirl shader
Shader
Shadcn/Tailwind/TypeScript integration of the prompt's verbatim `FluidSwirl` raw-WebGL component (three pigments folded into an endless paint vortex on a single full-screen quad) dropped into `@/components/ui`, framed as the "FLUX" pigment-mixing console — the shader's hard-coded uniforms become an additive, backward-compatible props API driving three live colour pickers, contrast/spin/flow/pixel-filter faders, a polar-warp toggle, six paint presets and a randomiser, with pointer/touch steering the spin and a signature pigment-trace oscilloscope reading the field's average luma straight off the framebuffer; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Grain gradient corners lab
Shader
"GRAINFIELD" — the prompt's verbatim `GradientBackground` (a `@paper-design/shaders-react` `GrainGradient` painting the **corners** shape: two rounded rectangles in warm orange→amber→pink grain on black) dropped into `components/ui`, then wrapped in a parametric `GrainGradientStage` twin so an instrument console can drive the whole uniform surface live — a shape selector across all seven `u_shape` modes (wave·dots·truchet·corners·ripple·blob·sphere), five named palettes, a uniforms deck of faders (softness·intensity·grain·scale·rotation·speed), a Freeze control, a four-tab copyable integration story (component/usage/parametric/setup) and a telemetry strip reading real FPS/clock/frames off a rAF loop; the preserved "Backgrounds are awesome :)" hero floats over it. Fonts vendored locally, CLI-verified headless with a WebGL render check.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Hive noise shader
Shader
"HIVE" — a faithful shadcn integration of the prompt's verbatim `hive.tsx` component, a single full-screen **WebGL2** fragment shader that raymarches a 20-step noise field and tints it with a flowing amber → magenta cosine spectrum; dropped **unedited** into `@/components/ui` (zero props, zero deps, zero assets) and mounted as a fixed full-viewport backdrop under a frosted shader lab: a hero, a spec HUD reading the shader's real shape (its `u_res`/`u_time` uniforms, raymarch steps, DPR clamp) instead of faked telemetry, an integration ticker, and a below-the-fold integration story (default paths, why `components/ui`, from-scratch setup, copyable source, a render-pipeline walkthrough, and a props/state/assets Q&A); CLI-verified with a headless screenshot light-check.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Liquid crystal shader
Shader
Shadcn-style integration of the verbatim raw-WebGL `liquid-crystal` component (simplex-noise interference bands on a single mouse-warped full-screen quad) dropped into `@/components/ui`, framed as a polarized-light optics bench — the prompt's top-left ControlsPanel drives the hue/speed/noise/warp/zoom/brightness uniforms, a crossed-polarizer reticle tracks the mouse-warp centre, an instrument rail reads live FPS/render clock/birefringence off the shader's own per-frame state, and an integration docket documents the drop-in; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Living nebula shaderSubscription
Living nebula shader
Shader
Shadcn-style integration of the brief's `LivingNebulaShader` — a two-layer fbm gas cloud (magenta plasma + ion-blue) that lenses around the cursor, rendered full-viewport with Three.js and framed as a deep-sky observatory sky-feed console: corner brackets, a scope scanline, a cursor lens reticle, and a live telemetry rail reading the shader's own per-frame state (feed clock, render FPS, and warp coordinates computed with the exact GLSL normalization); fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Morphing light shader
Shader
Faithful shadcn integration of the brief's verbatim `MorphingLight` Three.js shader (radially symmetric pink↔cyan morphing interference fringes on one full-screen quad) dropped into `@/components/ui` and reframed as **FRINGE**, a tabletop interferometer — the shader's baked constants (`2.5`/`4.0`/`8.0` + an HSV hue rotation) are promoted to four live "beam" faders, five named emission sources snap the field to stored uniforms, a concentric fringe reticle mirrors the shader's own radial symmetry, a cursor caliper reads fringe order at the optical axis, and a detector strip reads clock/FPS/axis intensity straight off the GPU via `gl.readPixels`; zero-prop `<MorphingLight />` stays byte-for-byte original, fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Novatrix gradient mesh
Shader
Shadcn/Tailwind v4/TypeScript integration of the prompt's `gradient-mesh.tsx` (the Novatrix `ogl` shader) dropped verbatim into `@/components/ui` and framed as the "NOVATRIX Gradient Mesh Lab" — a water-distorted fractal gradient field under the prompt's `mix-blend-overlay` "Gradient Mesh" headline, with a uniform control deck that promotes every baked-in constant (speed/swirl/scale/rotation/wave amp·freq·speed/grain/offsets/distortion) to a live fader, eight curated 3-stop palettes, an independent FPS·frame·clock telemetry HUD with pause-freeze, and a tabbed install / props-API / usage / why-`components/ui` dock; fonts vendored locally, fully procedural (no image assets).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Paper shaders control deck
Shader
Instrument-console "Control Deck" for driving live WebGL shaders — four selectable channels (paper-design Mesh Gradient / Dot Orbit / Combined plus the prompt's custom react-three-fiber GLSL Shader Plane + energy rings), a brushed-graphite scope housing with corner brackets/scanlines/vignette, live FPS·frame·uptime telemetry, and speed/intensity faders wired straight into the shader uniforms.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Radial shader
Shader
"Radial Bloom" — verbatim shadcn `components/ui` integration of the brief's single-file WebGL2 fragment shader (seven polar-gated rings blooming from one full-screen triangle, each rotating at its own `t·sin(i²)` rate under a phase-shifted cosine palette and a `tanh` tone-map), dropped in unedited and framed as an observatory instrument: the fullscreen component renders as a fixed background under a glass hero lockup, a right-rail telemetry HUD mirrors the shader's own `iTime`/`iFrame`/FPS and per-ring phase, and a scrollable deck documents the shadcn/Tailwind/TypeScript setup, the `components.json` aliases, why `components/ui` matters, the props/uniforms API, and a GLSL anatomy walkthrough; zero image/shader-library dependencies, fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Shader spectral clock
Shader
"SPECTRA CLOCK" integration of the brief's verbatim `shader-clock.tsx` — a raw-WebGL eight-fold cosine/sine domain warp coloured by a wavelength→RGB spectrum, with a live clock, editable location and °C/°F toggle floating over it — dropped into `@/components/ui` and framed as a spectral-field timepiece lab: a frosted clock card over the live field, a telemetry HUD reading the shader's own `iTime`/FPS/centre-pixel colour off the GPU, a control deck promoting the four baked GLSL constants (`for(i<8)`/`p*=2.0`/`p.y*50.0`/`iTime`) to live uniforms, a six-city world-preset bank with locally-generated skyline stills, a Freeze control and a CSS-aurora WebGL fallback; the verbatim `demo.tsx` is embedded untouched and fonts are vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Warp checks background lab
Shader
Shadcn integration of the prompt's `@paper-design/shaders-react` `<Warp shape="checks" />` dropped into `components/ui` (its malformed JSX fixed) and built into a polished, full-viewport animated checks-warp background — one `<Warp>` in a `fixed inset-0 -z-10` layer behind glassy product UI, a live console of faders for every uniform (proportion, softness, distortion, swirl, swirlIterations, shapeScale, scale, rotation, speed), a shape selector and four mood presets, a live-vs-prompt props ledger, an in-page shadcn/Tailwind/TS setup write-up, and an rAF FPS/frame/uptime telemetry strip; boots on the prompt's exact four-colour config, fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Webgl flowing gradient shader
Shader
Shadcn/Tailwind v4/TS integration of a raw-WebGL flowing-gradient fragment shader, framed as the "PRISMA Shader Lab" — a cursor-reactive fractal field with viewfinder chrome, a layers/glow/speed control rail, and a live FPS/time/resolution telemetry HUD.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
WebGL Shader Animation - Four GLSL fragment shader presets: plasma, wave distortion, Voronoi, kaleidoscope
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Light Beam ButtonSubscription
Light Beam Button
Button
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Iridescent orb
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Sparkle AI button
Button
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Retro pixel scene
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Halftone scene
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
ASCII render
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Expressive orb face
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Liquid metal
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Digital glitch pass
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Bloom glow scene
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Brush ripple displacement
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Dithered image reveal
Shader
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Hero button expandableSubscription
Hero button expandable
Shader
Shadcn/Tailwind v4/TS integration of the prompt's `hero-button-expendable` — a GodRays-lit "Nexus" hero whose pill CTA performs a framer-motion shared-layout morph (`layoutId`) into a full-screen MeshGradient demo-request modal with an animated idle→submitting→success form; both shaders from @paper-design/shaders-react, fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Sdf dreamscape shaderSubscription
Sdf dreamscape shader
Shader
Shadcn-style integration of the verbatim "SDF Dreamscape" component — a native-WebGL fractal signed-distance-field (a recursive Julia-fold bent live by the cursor) ported to strict TS in `@/components/ui` and reframed as the "Oneirograph" dream-recorder console: a Big Shoulders hero lockup, a registration frame + reticle, four tuning dials (Spectrum/Drift/Recursion/Lens) annotated with their `u_*` uniforms, Lucid/Abyssal/Solar/REM presets that snap all four at once, and a live telemetry strip reading the shader's own FPS and dream clock; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Sickui waitlist mesh shaderSubscription
Sickui waitlist mesh shader
Shader
Shadcn-style integration of the verbatim `background-shader.tsx` — a deep-blue `@paper-design/shaders-react` `MeshGradient` backdrop — copied byte-for-byte into `components/ui` and grown into a full "SickUI" waitlist launch page: a glass email-capture card with validation + success state, an animated signup tally and gradient-monogram social proof, a "what's shipping" feature grid, and nav/footer floating over the living shader; Unsplash is network-blocked here so avatars are synthesised locally and fonts are vendored, so it runs fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Thermal shader imagingSubscription
Thermal shader imaging
Shader
"THERMA — Thermal Imaging Bay" integration of the prompt's verbatim `ThermalEffect` (Apple-style three.js shader painting a pointer-reactive 7-stop thermal gradient inside a logo's alpha mask) dropped into `@/components/ui`, framed as thermographic hardware — bracketed viewports with a reticle, a live sensor-clock/FPS/core-temp telemetry HUD, the brief's `logo × logo` two-up plus a specimen tray, a palette/LUT calibration ramp and props API; logo masks are drawn on a canvas at runtime so it runs fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Fuzzy rabbit button
Button
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Rainbow border button
Button
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in