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
Mood (playful, calm)
Industry
Style
Source repo
Effects folder
- Subscription
Verdant advisory h10
Hero Section
Quiet-luxury advisory hero — oversized forest-green card, Hedvig serif headline, floating glass stat chip, infinite trust marquee, count-up stats and approach cards on a white canvas.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Almond hours h65
Landing Page
"Warm Clinical Editorial" dignified-care senior-living landing for "Almond Hours" — near-white paper with almond-ink neutrals and a butter-cream tint, a floating rounded mega-menu nav with flip hovers, an infinite photo marquee, a dual-headline hero with text-wipe reveal, a horizontal width-morphing programs accordion with layered image stacks, a healthcare bento grid, a single-open FAQ, a wipe-fill CTA banner, and a cursor-reveal giant wordmark.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Amberhaus pet atelier h31
Landing Page
"Amberhaus" warm-amber luxury pet-boutique landing — crisp white paper with a single amber-gold accent and butter-cream tints, Bricolage Grotesque display + Playfair italic flourishes, a crossfading triptych hero with parallax center panel, services+boutique bento, a horizontal-scroll founder story, vertical marquee testimonials, a jumping-type footer canvas, paw cursor, and a slide-up booking overlay.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Auric clinic glow h37
Landing Page
"Auric" precision dermaceutical-clinic landing (Clinical Warmth aesthetic) — clay-terracotta on ivory-cream with Archivo, a floating pill nav, full-bleed glowing-skin hero with staggered word reveal, an overlapping three-column action grid, a clay marquee, signature-treatment cards, a count-up science split, a quiet testimonial, and a deep-clay CTA band.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Cartwright relocation h47
Landing Page
"Warm Artisan Logistics" white-glove relocation landing for "Cartwright & Co" — terracotta-on-cream editorial palette with a Fraunces italic serif accent, dual opposite-scrolling hero image tickers, a mega-menu glass navbar, partner marquee, soft service cards, a dark count-up stats band, a staggered three-step process timeline, an auto-cycling stacked testimonial deck, and a split contact panel with a working quote form.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Cerulean precision collective h67
Landing Page
"Clinical Serenity" precision-medicine landing for "Cerulean Collective" — cool medical-blue (#0F4490) + soft-teal (#4AA9C5) on near-white with vendored Instrument Sans + Inter Tight, an ellipse-clipped full-bleed hero with floating glass trust chips, a three-column methodology grid with slide-in columns and a rotated-plate portrait, a 12-col specialties bento with hover image-zoom, a float-looping metrics band, and a black-bordered marquee-headed "Request Invitation" intake form over animated pulsing grid lines; per-character heading reveals, IntersectionObserver scroll reveals, prefers-reduced-motion aware, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Claywell solene h5
Landing Page
Warm-clay editorial landing page for "Solène", a terracotta-and-cream longevity & precision-movement clinic, with an asymmetric split hero, word-by-word heading reveals, zig-zag scroll sections, an infinite marquee, and a dark science band.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Cobalt repairworks h78
Landing Page
"Workbench Editorial" electronics-repair landing for "RepairWorks" — warm paper-cream canvas with one confident cobalt accent, tight Host Grotesk display + IBM Plex Mono labels, square-glyph logo marks, a left-aligned hero with a "what we fix" device-card grid, a hover-pausing brand marquee, a 2-up services grid with mono spec ticks and prices, a 3×2 benefits grid, a tinted identity split, a 4-up image/quote testimonial grid, a 2-up FAQ, and a panelled final CTA; IntersectionObserver staggered scroll reveals, scroll-aware header, prefers-reduced-motion aware, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Crimson cut studio h72
Landing Page
"Warm-Paper Viral Studio" landing for "Crimson Cut", a short-form video-editing agency — warm off-white paper canvas, pine-ink panels and one loud crimson accent, a floating pill nav, a centered hero with an inline rotated editor-palette sticker, staggered grayscale-to-color 9:16 video cards, a 2×2 services grid with rotating decorative shape clusters, a dark bento stats band, two-up case studies, an exclusive FAQ accordion, three pricing tiers, a seamless CSS testimonial marquee, and a split final-CTA panel; IntersectionObserver scroll reveals, vendored Manrope + imagery, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Fernhollow pet wellness h68
Landing Page
"Forest Apothecary" pet-wellness landing for "Fernhollow" — bone-cream canvas, fern-green ink, and a warm clay accent with Fraunces display type; centered hero with an auto-scrolling photo marquee, count-up stat band, ken-burns showreel panel, split service cards, dark process ritual with grayscale-to-color photos, botanical product grid, single-open FAQ accordion, and an ink-green newsletter CTA with a success state.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Gridframe precision h74
Landing Page
"Precision Grid Studio" enterprise growth-systems landing for "Meridyne" — a Swiss engineering dossier on warm paper, deep forest-green + butter-cream accents, hairline-ruled cells with registration "plus" crosshair markers straddling every frame corner, Inter Tight throughout, a celled nav with flip-up hover links and a hover mega-menu, a cream testimonial-card hero with overlapping portraits, an infinite logo marquee, numbered strategy steps, a four-cell capabilities band, count-up impact stats, a single-open FAQ accordion, and a solid-green CTA panel; scroll reveals and fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Grove kitchen fresh h70
Landing Page
"Forest Deli" fresh dog-food D2C landing for "Grove Kitchen" — warm cream paper with forest-green + terracotta accents and a faint kraft-paper grain, Fraunces display serif (italic emphasis) over DM Sans, a crossfading scrim hero with a popup menu card, a dashed-badge trust strip, a six-recipe catalog with add-to-box buttons, a serif marquee ticker, a 2×2 why-fresh bento with a 200°F stat chip, numbered how-it-works steps, monogram testimonials, an accordion FAQ, and a bouncing "FRESH." footer canvas with an overlapping contact card.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Harbour hearth h64
Landing Page
"Warm Sanctuary" compassionate senior-living landing page for fictional boutique care community "Harbour & Hearth" — sun-warmed oat-cream canvas with a single burnt-terracotta accent and cocoa-ink dark sections, Inter Tight, a floating glass pill navbar, a full-viewport scrim hero with a glass feature card, an overlapping about card with fanned polaroid thumbnails, alternating care/service rows, a count-up stats band, an infinite values marquee, a snap testimonial slider, a team grid, and a right-sliding mobile overlay.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Hearthwell homeware h71
Landing Page
"Marmalade Editorial" homeware essentials store landing for fictional D2C brand "Hearthwell" — warm grey paper canvas with a single saturated marmalade-orange accent, Fraunces display serif (italic emphasis) over Inter, a floating glass pill navbar, a centered hero with a 3-slide cross-fade image frame plus an overlaid "featured item" card and clickable slide dots, a pausable value-prop marquee, tall category cards with zoom-on-hover, an 8-item bestseller grid with badges, a 3-slide auto-rotating editorial split, a starred testimonial band, an ink newsletter card with inline validation + success state, and a multi-column footer; IntersectionObserver scroll reveals, reduced-motion aware, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Ink vermilion personal brand h23
Landing Page
"Ink & Vermilion" editorial personal-brand landing page for fictional marketing consultant "Marlowe Vane" — warm paper canvas, single vermillion accent, Playfair italic emphasis with hand-drawn SVG scribbles/stars/arrows, a rotated red marquee strip, scroll-reveal sections, a dark gallery band, grayscale-to-color imagery, and fake-submit contact + newsletter forms.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Lantern broth midnight ramen h8
Landing Page
Warm modular-bento landing page for a late-night Japanese ramen bar "Lantern Broth", with terracotta/mustard/teal tiles, Oswald + DM Sans, scroll-reveal animations, drifting steam, and a vanilla-JS testimonial carousel.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Lantern loft tutoring h1
Landing Page
Warm "paper studio" home-tutoring landing page for Lantern & Loft with a Fraunces/Jakarta editorial hero, offset cards, marquee, animated stat counters, tilted cards, and stacked program rows.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Lumen vector h92
Landing Page
"Electric Brutalism" creative-agency landing for "Lumen Vector" — a midnight-indigo hero that explodes into candy-pastel panels, Anton poster type + Geist, floating glossy tag-pills with soft glows, a giant multi-color headline with a glass-ringed CTA, seamless logo marquee, six pastel service cards, a fan-out methodology card deck on scroll, scroll-linked testimonial parallax, two-tier pricing on a blue panel, and a FAQ accordion.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Lumina maternite h2
Landing Page
"Lumina Maternité" — a calm, editorial maternity & women's-health sanctuary landing page on a bone/moss/blush palette with Fraunces + Geist, drifting hero blobs, an auto-scrolling image marquee, sticky-stacking journey cards, an interactive packages selector, FAQ accordion, and a booking form.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Riso rebel fest h20
Landing Page
Floating-pill neo-brutalist landing page for fictional design conference "Riso Rebel Fest" — warm off-white canvas, oversized riso-color bento cards with animated motifs, chunky Shrikhand display serif, grayscale-to-color speaker grid, tiered tickets, and scroll-reveal.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Sencha atelier h12
Landing Page
Wabi-editorial landing page for "Sencha Atelier", a ceremonial-matcha tea house — oversized Fraunces serif hero on warm paper, flush rounded showcase cards, editorial menu rows, count-up stats ribbon with marquee, and an asymmetric gallery.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Slow roast atelier h84
Landing Page
"Quiet Pastel Block-Grid" artisan coffee roastery & micro-bakery landing for Slow Roast Atelier — a calm gallery-like editorial built entirely from edge-to-edge flat dusty-pastel panels (rose/cream/lilac) divided by paper gutters, oversized low-contrast Manrope display type on Inter Tight, one grounding deep-pine-green accent, an asymmetric 740/380/324 hero block-row with a desaturate→color café photo strip and a green "View Menu" CTA bar, a three-cell menu preview with hairline price rows, a philosophy split with a circular "Direct Trade" badge, a three-card locations row, and a "Stay Grounded" subscribe footer; IntersectionObserver scroll reveals, slide-in mobile menu, vendored fonts + imagery, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Solace wellness grid h13
Landing Page
"Quiet luxury wellness" editorial landing page for the holistic studio Solace — an asymmetric bento color-block grid (oat/dusty-rose/lilac/sage panels) with oversized light Manrope display type, a desaturated→color image strip, looping keyword marquee, practices bento, sage stats band, guide portraits, and a reserve form; self-hosted fonts, scroll-reveal, slide-in mobile menu.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Terra craft editorial h58
Landing Page
"Quiet Craft Editorial" landing page for the artisan furniture house Terra Studio — a warm cream paper canvas with IBM Plex Serif display type, a two-column hero whose charcoal panel holds three overlapping mat-board image cards with mouse-parallax + hover-lift, an infinite materials marquee, a framed product collection grid, an atelier philosophy split, a count-up stats band, and a swap-to-success newsletter CTA; self-hosted fonts, scroll-reveal, mobile menu.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Verdant pledge bento h49
Landing Page
"Soft Editorial Bento" conservation-collective landing page (Verdant Pledge) on a white canvas of 40px rounded bento cards with a single electric-lime accent and Inter Tight, featuring a 5/7 lime+photo hero with floating glass map markers, an editorial missions table with rotated hover previews, image problem cards, a dark impact band with count-up stats, and scroll-reveal motion.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Verdant salon h91
Landing Page
"Heritage Verdant" elite social-strategy agency landing page (Verdant Salon) on a warm paper-beige canvas with midnight-green panels and cocoa-brown ink, Playfair Display + Inter Tight, a centered oversized serif hero with staggered portrait cards that reveal via tiled grid-demask animation, count-up impact stats, hairline service rows with floating rotated hover previews, an alternating heritage gallery, a green inquiry panel with a faked submit, and scroll-reveal motion.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Verdant spine clinic h66
Landing Page
"Clinical Calm" precision-chiropractic & movement-science clinic landing page (Verdant Spine) on a warm grey-green paper canvas with a single sage + deep-forest palette, Schibsted Grotesk + Inter, a split editorial hero with a frosted-glass appointment card floating over the clinic image, gradient stat cards, a deep-forest services panel with an infinite giant-type marquee and zoom-on-hover service cards, a sticky numbered "how it works" track, a glass-quote testimonial carousel, a 3-up journal grid, and scroll-reveal motion.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Verdigris trail h50
Landing Page
"Architectural Trail" landing page for fictional architecture studio "Verdigris Archi." — fennel-pastel canvas with a single luminous mint accent, Playfair Display serif + Inter Tight, a fixed vertical hairline "trail" with a travelling mint comet, a circular Begin-Trail hero CTA, a pillar marquee, grayscale-to-color brutalist concrete photography, numbered principle columns, a staggered project gallery, an ink count-up stats band, and a pill CTA.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Voltaic grid advisory h75
Landing Page
"Putty & Voltage" strategic-advisory landing on a warm putty-grey canvas built from large rounded tiles, Host Grotesk + Inter, one electric-lime accent over soft pastel cards, a golden-hour photo hero with social-proof avatars, a 3-up stat grid, a sticky stacking services deck in lavender/yellow/pink/mint, a lavender testimonial panel, an expanding case-study list, an infinite masked insights ticker, a lime CTA, scroll-reveal motion and a mobile dropdown nav.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Voltic showroom h89
Landing Page
"Electric Stone" premium offline-electronics experience-center landing (Voltic) — a warm stone canvas with near-black ink and a single electric-lime accent, self-hosted Inter, a framed split hero with the stacked touch./feel./choose. headline and lime terminal dots, a floating pill nav, an infinite pausable demo-product marquee, a 4-up zoom-on-hover Curated Zones grid, an interactive accordion that cross-fades a paired image, an ink "Bestseller" pricing-deal trio, a lime WhatsApp/Call CTA band, an inertial lime cursor and a slide-in mobile menu.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Realmagic ticker scroll
Scroll Effect
"Real Magic" Coca-Cola-flavored horizontal ticker-tape scroll built with GSAP ScrollTrigger — one continuous sentence ("In every bottle, discover the undeniable Real Magic of sharing pure Refreshment that brings us Together") laid out in a single nowrap flex line on a flat #f40009 red stage, read sideways as the pinned viewport scrubs the line horizontally (travel = scrollWidth − vw, end +=travel×1.15, scrub 0.6). Heavy Anton uppercase words alternate with faint italic Instrument-Serif connectives and outlined-stroke accent words (Magic/Together), with inline currentColor SVG glyphs (bottle, rising carbonation bubbles, signature ribbon swoosh, droplet, clinking bottles, heart full-stop) embedded like punctuation with variable per-item margins; idle looping glyph micro-motion, accent depth parallax, a cream scroll-progress bar, grain + vignette overlays, and an "Open happiness." outro after the pin releases. GSAP + fonts vendored locally, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Stacking cards portfolio
Landing Page
A calm editorial portfolio template whose core experiment is the "stacking cards" scroll effect — five project cards (Lumen, Atlas Type, Harbor, Solène, Field Notes) each `position:sticky` pinning at an increasing top offset so the deck fans downward, while a scroll-linked JS scrub shrinks (scale 1→0.94), dims (brightness 1→0.82) and darkens (cover opacity 0→0.5, easeOutCubic) each buried card as the next slides over it like a dealt deck; warm #ECE9E2 paper over near-black ink with a single terracotta #C8553D accent, Instrument Serif display + Inter UI, an SVG paper-grain overlay, a glass pill nav, breathing-rings / glyph-specimen / abstract-chart / layered-magazine / generative-grid CSS-and-SVG card art (no photos), and a dark ink contact footer; fonts vendored locally, fully offline, honors prefers-reduced-motion. Built same-to-same to a superdesign reference (host blocked by the build network, so reproduced from its canonical editorial-portfolio pattern + the seed prompt).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Cobalt bento folio h43
Landing Page
"Daylight Workbench" light-glass bento developer portfolio — cool pale-gray canvas with a colossal royal-cobalt PORTFOLIO hero tile, frosted-glass panels, pointer-parallax + specular hero, typewriter rotator, animated skill ring, count-up stats, and a validated contact form.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Inkpress atelier h46
Landing Page
"Inkpress Atelier" risograph-print graphic-designer portfolio staged as a folded zine — cream paper frame, 4-color registration bar, Anton display type, diamond logo plate, services menu, colored works grid, and scroll reveals.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Gradient dots background
Background
Shadcn/ui integration of the verbatim `GradientDots` component — a hue-cycling hexagonal CSS `radial-gradient` dot field looped with framer-motion — dropped into `@/components/ui` and framed as a component lab: a full-bleed live hero (the verbatim demo) with a render-FPS/uptime telemetry strip, a control deck of faders wired straight to the real props (dotSize/spacing/duration/colorCycleDuration + a background colour control) with named presets and a live-usage snippet, a four-step shadcn-CLI integration story explaining the default paths and why `/components/ui` matters, and a props API with the prompt's data/state/assets/responsive/placement Q&A; zero component assets (pure CSS), fonts vendored locally, fully offline.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Lumen aurora vcard h62
Card
"Lumen Aurora" personal digital visiting card for a fictional creative technologist — one frosted-glass card floating over a slow living aurora of drifting violet/teal/rose blobs with film-grain and vignette, stacking a meta bar with a live local clock, an avatar-ring hero with a pulsing emerald "available" status, a short first-person bio with mono tag chips, a three-up email/call/WhatsApp action grid, a five-up social row, and an amber "Save contact" button that generates a vCard 3.0 `.vcf` blob client-side plus a "Copy link" toast; cinematic near-black palette, Fraunces display serif over Geist + Geist Mono, pointer parallax with specular sheen, staggered reveal, real mailto/tel/wa.me links, all fonts and portrait vendored locally, fully offline.
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
Celestial bloom shader
Shader
Procedural GLSL "Celestial Bloom" fragment shader — a five-petalled nebula with a glowing star core and twinkling field, rendered full-viewport with Three.js and framed as an observatory specimen plate with reticle corners, a Fraunces hero lockup, and a live telemetry HUD (mission clock, render FPS, petals) driven by the shader's own per-frame state; 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
Digital petals shader
Shader
Shadcn-style integration of the brief's `DigitalPetalsShader` — a polar-coordinate GLSL flower on a single full-screen quad with Three.js dropped into `@/components/ui`, framed as a herbarium specimen plate: the corolla breathes between three and seven petals, the cursor seeds a soft light bloom, and a signature **Petal Dial** gauge plus a cultivation-log HUD read the shader's exact per-frame petal count and state straight off the GPU; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Dotted surface waves
Background
Shadcn/Tailwind v4/TS integration of the verbatim `DottedSurface` component — a full-viewport three.js `Points` lattice (40 × 60 = 2,400 dots) displaced by two crossing sine waves — framed as a quiet "field generator" with a centred Geist Mono lockup + radial glow and a live `next-themes` toggle that flips the dot palette (light dots on dark ↔ dark dots on light) in real time; fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Flowing waves shader
Shader
Shadcn/Tailwind/TypeScript integration of the prompt's `InteractiveWaveShader` (a nine-iteration cosine-displacement Three.js fragment-shader wave field on one full-screen quad), framed as a "tidal field observatory" — a live buoy-telemetry panel reads significant wave height/period/turbulence straight off the GPU via `gl.readPixels`, with a sea-state mode selector, center-clarity toggle, and amplitude dial steering the shader's `mode`/`dimmingDisabled`/`intensity` uniforms; 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
Glsl hills shader
Shader
Shadcn/Tailwind/TypeScript integration of the brief's verbatim `GLSLHills` — a monochrome 3-octave Perlin hill range on one 256² `RawShaderMaterial` plane, folded to face the camera and pushed forever forward so its far ridges dissolve into haze — dropped into `@/components/ui` and framed as the "FOGBANK" low-visibility terrain monitor: the canonical demo lockup floats over a viewfinder stage (reticle, scanlines, sweep), a drift console of four faders promotes the props + baked fog/haze constants to live uniforms with four field presets, and the signature visibility gauge plus a telemetry strip read drift clock / FPS / cam depth / visibility (km) and ridge-crest straight off the GPU framebuffer; hold/resume drives the shader clock, fonts vendored locally.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Grainy gradient ripple card
Card
Shadcn integration of the brief's verbatim `gradient-shader-card` — a grainy 7-stop gradient (domain-warped value noise + 3D simplex grain + overlay film grain) rendered on a single React-Three-Fiber quad that ripples where you tap it — dropped into `@/components/ui` and framed as the "Chroma Foundry" pigment-lab console: a rail with the exact 7 hex stops the shader mixes, five faders promoting the baked `noise*`/`waveNoise*` constants to live uniforms, named patches (Foundry/Silk/Marble/Static/Tide), click-to-ripple with tactile DOM markers, and a telemetry strip reading the shader's own clock + live ripple count off the GPU loop; fonts vendored locally, headless WebGL + interaction verification (9/9).
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Mesh gradient shader hero
Hero Section
Shadcn-style integration of the prompt's `HeroSection` — a hero whose background is a flowing `@paper-design/shaders-react` MeshGradient under a frosted veil — dropped verbatim into `@/components/ui` and framed as a warm "palette studio": the live hero sits in a registration-bracketed plate while a control deck drives the shader's real props (color stops, distortion, swirl, speed, offsetX) in real time, with light/dark veil toggle, FPS·frame·uptime telemetry, and a tabbed install / props-API / live-usage / why-`components/ui` dock; Onest vendored locally as the Satoshi substitute.
This is part of a CreativePower subscription. Subscribe to see its code and use it in your pages.
Sign in - Subscription
Realistic fog background
Shader
"HAAR" sea-fog instrument integrating the prompt's realistic-fog-background — a WebGL fragment-shader fog (six octaves of domain-warped fBm on one full-screen quad lit by a cursor "lighthouse beam") dropped into @/components/ui; the signature visibility gauge reads the shader's own framebuffer luminance off the GPU via gl.readPixels, a control deck promotes every baked constant to a live uniform with a five-patch fog bank (Sea Haar → Pea Souper → Dry Ice → Moor Drift → Clear Dawn), plus 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