xpert-ai
- 277 skills
- 0 followers
- 22 hours ago last updated
- ▌ Target Cursor · xpert-ai bundleAn animated target ring replaces the cursor and grows when it hovers buttons/links — a focused, techy pointer. One per page. Off on touch and under prefers-reduced-motion.
- ▌ Text Scramble · xpert-ai bundleResolve one short headline from random glyphs — a techy decode reveal. One short line only; keep it fast. The resolved text is the real, accessible content; under prefers-reduced-motion it appears instantly with no scramble. Avoid on body copy and calm/luxury tones.
- ▌ Toggle Spring · xpert-ai bundleA switch whose knob springs across on toggle — a tactile, satisfying on/off state change. Use for settings/form switches. Honors prefers-reduced-motion (quick linear slide). Trigger on user intent only; keep the spring subtle — never to convey loading/progress.
- ▌ Xyz Rotate · xpert-ai bundleRotate In — a composable AnimXYZ entrance via the xyz="fade rotate-right-45" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Anim Backoutup · xpert-ai bundleBack Out Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceout · xpert-ai bundleBounce Out — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutup · xpert-ai bundleFade Out Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Headshake · xpert-ai bundleHead Shake — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Heartbeat · xpert-ai bundleHeart Beat — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Rotateout · xpert-ai bundleRotate Out — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideinup · xpert-ai bundleSlide In Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoomoutup · xpert-ai bundleZoom Out Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Fx Confetti · xpert-ai bundleConfetti fires across the frame — for wins and reveals. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Firework · xpert-ai bundleFireworks launch and burst — a festive hero moment. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Decrypted Text · xpert-ai bundleScrambled characters resolve into the real text on hover or view — a techy decode for a short label. The resolved text is the real, accessible content; under prefers-reduced-motion it shows instantly.
- ▌ Elastic Slider · xpert-ai bundleA slider with a springy fill and knob — playful, tactile input. Use for a single prominent control (volume, brightness). Under prefers-reduced-motion it moves without the spring.
- ▌ Shimmer Button · xpert-ai bundleMake one primary CTA feel premium: a soft band of light sweeps across it (slowly at rest, faster on hover). Reserve for the single primary button; keep it subtle. Pure CSS; the sweep stops (solid button) under prefers-reduced-motion. Do not use on secondary/destructive buttons or many at once.
- ▌ Spotlight Card · xpert-ai bundleGive feature/pricing cards a premium feel: a soft radial spotlight follows the cursor across the card and lifts its border. Keep the glow subtle and low-contrast. Falls back to a plain static border under prefers-reduced-motion and on touch. Do not use on text-dense reading surfaces.
- ▌ Xyz Fade Up · xpert-ai bundleFade Up — a composable AnimXYZ entrance via the xyz="fade up-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Xyz Flip Up · xpert-ai bundleFlip Up — a composable AnimXYZ entrance via the xyz="fade flip-up-90" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Anim Backindown · xpert-ai bundleBack In Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Backinleft · xpert-ai bundleBack In Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceinup · xpert-ai bundleBounce In Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeindown · xpert-ai bundleFade In Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeinleft · xpert-ai bundleFade In Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Rubberband · xpert-ai bundleRubber Band — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideoutup · xpert-ai bundleSlide Out Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoomindown · xpert-ai bundleZoom In Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoominleft · xpert-ai bundleZoom In Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Fx Shockwave · xpert-ai bundleAn expanding shockwave ripple — an impactful beat. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Starfield · xpert-ai bundleA slow drifting starfield — a calm cosmic backdrop. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Attention Pulse · xpert-ai bundleA soft expanding ring that draws the eye to ONE element — a primary CTA, an unread badge, a new dot. Honors prefers-reduced-motion. One per screen; never use more than one at once or as pure decoration (attention splits and nothing wins).
- ▌ Card Lift Hover · xpert-ai bundleLift a clickable card toward the viewer on hover with a deepening shadow — a tactile, responsive cue. Pure CSS, no JS. Only use on actually-clickable cards (motion implies clickability). Honors prefers-reduced-motion (static). Avoid on very dense grids where many lifts feel noisy.
- ▌ Electric Border · xpert-ai bundleA jittery electric outline traces a card — an energetic accent for one hero element. One per view. Pure CSS; a static solid outline remains under prefers-reduced-motion.
- ▌ Faulty Terminal · xpert-ai bundleA distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.
- ▌ Gradient Blinds · xpert-ai bundleA distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.
- ▌ Loading Shimmer · xpert-ai bundleSkeleton placeholders with a soft sweeping shimmer while content loads. Use to fill space for cards/lists/profiles that are still loading and make the wait feel shorter. Honors prefers-reduced-motion (static skeleton). Only show while real content is loading — never as decoration.
- ▌ Magnetic Button · xpert-ai bundleMake a primary button feel alive by gently pulling it toward the cursor as it approaches, then springing back. Keep it subtle and reserve it for one or two primary actions. Disabled on touch and under prefers-reduced-motion. Do not use it on dense UIs full of buttons.
- ▌ Prismatic Burst · xpert-ai bundleA distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.
- ▌ Xyz Fade Big · xpert-ai bundleFade Big — a composable AnimXYZ entrance via the xyz="fade big-50%" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Xyz Rise Big · xpert-ai bundleRise Big — a composable AnimXYZ entrance via the xyz="fade up-5 big-25%" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Anim Backinright · xpert-ai bundleBack In Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Backoutdown · xpert-ai bundleBack Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Backoutleft · xpert-ai bundleBack Out Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceoutup · xpert-ai bundleBounce Out Up — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeinright · xpert-ai bundleFade In Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeinupbig · xpert-ai bundleFade In Up Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutdown · xpert-ai bundleFade Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutleft · xpert-ai bundleFade Out Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideindown · xpert-ai bundleSlide In Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideinleft · xpert-ai bundleSlide In Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoominright · xpert-ai bundleZoom In Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoomoutdown · xpert-ai bundleZoom Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoomoutleft · xpert-ai bundleZoom Out Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Fx Neural Net · xpert-ai bundleA pulsing neural network — an AI backdrop. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Orbit Ring · xpert-ai bundleParticles orbiting rings — an elegant loop. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Kinetic Headline · xpert-ai bundleStagger a headline's words (or letters) in on load, one after another. Use for a single hero headline or a title card in a launch video. Honors prefers-reduced-motion. One per screen; never use on body copy or must-read content.
- ▌ Pixel Transition · xpert-ai bundleA card reveals a second face through a burst of pixel tiles on hover — a retro reveal. A few cards, not a grid. Under prefers-reduced-motion the back face just appears.
- ▌ Xyz Fade Down · xpert-ai bundleFade Down — a composable AnimXYZ entrance via the xyz="fade down-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Xyz Fade Left · xpert-ai bundleFade Left — a composable AnimXYZ entrance via the xyz="fade left-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Xyz Flip Left · xpert-ai bundleFlip Left — a composable AnimXYZ entrance via the xyz="fade flip-left-90" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Anim Backoutright · xpert-ai bundleBack Out Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceindown · xpert-ai bundleBounce In Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceinleft · xpert-ai bundleBounce In Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutright · xpert-ai bundleFade Out Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutupbig · xpert-ai bundleFade Out Up Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Jackinthebox · xpert-ai bundleJack In The Box — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideinright · xpert-ai bundleSlide In Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideoutdown · xpert-ai bundleSlide Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideoutleft · xpert-ai bundleSlide Out Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Zoomoutright · xpert-ai bundleZoom Out Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Fx Chain React · xpert-ai bundleA chain reaction of bursts ripples across the frame. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Data Stream · xpert-ai bundleStreaming data lines — a flowing techy backdrop. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Matrix Rain · xpert-ai bundleFalling code glyphs — a techy backdrop. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Xyz Fade Right · xpert-ai bundleFade Right — a composable AnimXYZ entrance via the xyz="fade right-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Xyz Fade Small · xpert-ai bundleFade Small — a composable AnimXYZ entrance via the xyz="fade small-50%" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
- ▌ Anim Bounceinright · xpert-ai bundleBounce In Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceoutdown · xpert-ai bundleBounce Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Bounceoutleft · xpert-ai bundleBounce Out Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeindownbig · xpert-ai bundleFade In Down Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeinleftbig · xpert-ai bundleFade In Left Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeintopleft · xpert-ai bundleFade In Top Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Slideoutright · xpert-ai bundleSlide Out Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Lottie Favorite · xpert-ai bundleA heart/favorite icon that animates on toggle — Lottie JSON, portable across web & app. A Lottie (JSON) animation — portable motion that plays identically on web and app via lottie-web. Honors prefers-reduced-motion (don't autoplay). Reserve Lottie for motion that earns its ~160KB runtime.
- ▌ Fx Galaxy Swirl · xpert-ai bundleA swirling galaxy of particles. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Word Cascade · xpert-ai bundleWords cascade into place — a kinetic title. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Anim Bounceoutright · xpert-ai bundleBounce Out Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeinrightbig · xpert-ai bundleFade In Right Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeintopright · xpert-ai bundleFade In Top Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutdownbig · xpert-ai bundleFade Out Down Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeoutleftbig · xpert-ai bundleFade Out Left Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeouttopleft · xpert-ai bundleFade Out Top Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Rotateinupleft · xpert-ai bundleRotate In Up Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Fx Constellation · xpert-ai bundleConnected points like a constellation — quiet motion. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Gradient Blob · xpert-ai bundleSoft drifting gradient blobs — a warm ambient glow. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Fx Sparkle Trail · xpert-ai bundleA trail of sparkles — a light, delightful accent. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.
- ▌ Anim Fadeoutrightbig · xpert-ai bundleFade Out Right Big — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Fadeouttopright · xpert-ai bundleFade Out Top Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Rotateinupright · xpert-ai bundleRotate In Up Right — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- ▌ Anim Rotateoutupleft · xpert-ai bundleRotate Out Up Left — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.