shader-gen
FeaturedAI shader generator for WebGL video effects, transitions, masks, and color grading (LUT / 调色 / 电影感 / film look). Use when the user wants a video effect (滤镜 / 特效), a transition (转场 / crossfade / wipe / cube / 3d), a mask (蒙版 / 遮罩 / reveal), a zoom / push-in (推近 / 推镜头), or a color grade — try the built-in effects (zoom, builtin LUTs) before generating a new shader.
Install
Quality Score: 93/100
Skill Content
Details
- Author
- 0xsline
- Repository
- 0xsline/OpenChatCut
- Created
- 1 months ago
- Last Updated
- today
- Language
- TypeScript
- License
- AGPL-3.0
Integrates with
Similar Skills
Semantically similar based on skill content — not just same category
shaders
Guides building GPU-accelerated visual effects in React / Next.js with the `shaders` npm package from shaders.com — declarative `<Shader>` component trees, composition (stacking, nesting, blend modes, masking), reactive props, dynamic prop drivers (`auto-animate`, `mouse-position`, `map`), shape (SDF) effects, color space, performance budget (RTT / generator vs filter), and SSR safety. Use when the user asks to add a "shader background", "WebGPU effect", "aurora / plasma / swirl / glass / cursor-trail" hero, mentions shaders.com, the `shaders/react` package, the `<Shader>` component, or wants animated GPU-rendered visuals in a React or Next.js app. Not for raw GLSL / WebGL / Three.js / react-three-fiber work — those use different APIs.
grainient
Recreate grainient.supply's 16 dark-mode visual effects as single-file HTML pages: WebGL shader gradients, vignette overlays, 9-layer box shadows, smooth scroll, spring animations, hover-zoom, ticker marquees, glassmorphism, 3D card flips, bento grids, gradient CTAs. Dark-mode-first with lime green (#C2F13C) accent. Triggers on grainient effects, dark-mode landing page, cinematic depth, glow effects, SaaS showcase, visual effects page.
backgrounds-gradients
Living backgrounds & moving gradients for motion-graphics videos — the layer that makes a frame feel alive instead of a static slide. Color-arc gradient that shifts per scene with drifting blobs, a soft mesh light-wash that glides across, blueprint line grids, dot-matrix fields, glowing neon curved paths with travelling light-dots, starfields, and grain/paper/paint texture overlays. Use when a scene looks flat or slide-like, when adding a moving gradient behind the whole piece, or matching a reference reel's animated background. Triggers: "moving gradient background", "gradient that shifts through the video", "make the background alive", "mesh gradient wash", "blueprint grid", "dotted background", "neon lines", "starfield", "film grain / texture overlay".