grainient
SolidRecreate 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.
Install
Quality Score: 87/100
Skill Content
Details
- Author
- tdimino
- Repository
- tdimino/claude-code-minoan
- Created
- 7 months ago
- Last Updated
- yesterday
- Language
- Python
- License
- MIT
Similar Skills
Semantically similar based on skill content — not just same category
aesthetic-presets
Whole-scene aesthetic presets for motion-graphics videos — combinations of background + element + type that read as one recognizable style. Isometric UI (planes on a 30° grid, floating, long shadow), collage/cutout (flat color + photo cutouts + torn-paper stickers + doodle connectors + halftone + timeline), Apple-minimalist (huge negative space, one shape/word, slow eases, thin type), crypto/neon-glow (near-black + starfield + neon edges + spinning 3D token), and dashboard-reveal (UI window rises in, charts grow, counters tick). Use when you want a named look for a whole scene/video, or matching a specific reference style. Triggers: "isometric style", "collage / cutout animation", "Apple-style minimalist", "crypto / web3 neon look", "dashboard reveal", "make it look like [that style]".
motion-graphics
Super-skill for motion-graphics videos in HTML/CSS/JS — the launch-reel / SaaS-explainer look. An umbrella over sub-skills for TEXT motion, BACKGROUNDS & GRADIENTS, ELEMENT / SHAPE / PARTICLE motion, GLASS & UI accents, PRODUCT composition, SCENE TRANSITIONS, and UI / DATA motion. Holds a named "platter" of ~40 reusable moves (each with a render-safe recipe) plus a drop-in building- block library (assets/motion.css + motion.js). Use when the user wants to build or restyle an animated title, explainer, launch/promo film, or any motion-graphics piece; make headings/scenes more dynamic; add moving gradients, drifting shapes, glowing rings/orbs, glass UI, transitions, animated charts/counters; match a reference reel; or asks for "the platter of skills / motion skills / a menu of effects". Composes with text-motion, kinetic-typography, glass-cards, smooth-render, vo-sync.
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".