r3f-drei
@react-three/drei helper library—OrbitControls, Text, Environment, useTexture, useGLTF, Html, Billboard, and 50+ abstractions that simplify common R3F patterns. Use when implementing camera controls, loading assets, rendering text, or needing common 3D utilities.
shader-effects
Visual shader effects—glow/bloom, chromatic aberration, distortion, vignette, film grain, scanlines, glitch, dissolve, outline, and fresnel. Use when adding visual polish, post-processing effects, or stylized rendering to shaders.
algorithmic-art
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
gemini-imagegen
Generate and edit images using the Gemini API (Nano Banana). Use this skill when creating images from text prompts, editing existing images, applying style transfers, generating logos with text, creating stickers, product mockups, or any image generation/manipulation task. Supports text-to-image, image editing, multi-turn refinement, and composition from multiple reference images.
image-gen
Generate images using Google's Nano Banana Pro (Gemini 3 Pro Image) with workflow-based prompting
graphics-rendering
|
shader-techniques
|
webgl-expert
Expert guide for WebGL API development including 3D graphics, shaders (GLSL), rendering pipeline, textures, buffers, performance optimization, and canvas rendering. Use when working with WebGL, 3D graphics, canvas rendering, shaders, GPU programming, or when user mentions WebGL, OpenGL ES, GLSL, vertex shaders, fragment shaders, texture mapping, or 3D web graphics.
glsl
GLSL shader programming for JARVIS holographic effects
webgl
WebGL shaders and effects for JARVIS 3D HUD
threejs-tresjs
3D HUD rendering with Three.js and TresJS for JARVIS AI Assistant
scroll-storyteller
Use when creating interactive scroll-based storytelling experiences with mouse-following spotlight effects, animated SVG art, and the Anthropic design language. Load for explainer pages, product showcases, visual narratives, or any content needing immersive scroll storytelling with organic shapes and smooth animations. Supports GSAP-powered or lightweight CSS-only animations.
nano-banana-pro
Generate images using Google's Nano Banana Pro (gemini-3-pro-image-preview). Accepts text prompts and optionally images (for editing/transformation) as INPUT. Returns generated IMAGES as OUTPUT. Use when user asks to create, generate, edit, or draw images, infographics, visualizations, diagrams, charts, or illustrations. Excellent for data-accurate infographics and text rendering.
algorithmic-art
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
Pixel Art Exporter
Export sprites to PNG, GIF, or spritesheet formats with JSON metadata for game engines. Use when the user wants to "export", "save", "output", "render", "generate", "create file", mentions file formats like "PNG", "GIF", "animated GIF", "spritesheet", "sprite sheet", "texture atlas", "tile sheet", or game engine integration with "Unity", "Godot", "Phaser", "Unreal", "GameMaker". Trigger on layout terms ("horizontal", "vertical", "grid", "packed", "strip"), scaling ("2x", "4x", "upscale", "pixel-perfect"), file operations ("save as", "export to", "output to"), metadata formats ("JSON", "XML", "metadata", "atlas data"), and delivery terms ("for web", "for game", "for Twitter", "for itch.io", "optimized").
Nano Banana Video Generation
Generate videos using Google Veo models via the nano-banana CLI. Use this skill when the user asks to create, generate, animate, or produce videos with AI. Supports text-to-video, image-to-video animation, dialogue with lip-sync, and scene extensions. Trigger on requests like "create a video", "animate this image", "make a video clip", "generate footage", "produce a short film", "add motion to this".
food-diorama-skill
Generate 3D historical gourmet diorama images for Chinese cities using Google Gemini API. Creates artistic miniature food worlds with four-quadrant layouts featuring iconic dishes, Pop Mart style figures, and cultural elements. Use when the user asks to create food diorama, 美食盲盒, gourmet blind box, city food scene, or mentions generating 3D food artwork for cities like 西安, 重庆, 成都, 北京, 广州.
fal-text-to-image
Generate high-quality images from text prompts using fal.ai's text-to-image models. Supports intelligent model selection, style transfer, and professional-grade outputs.
Page 3 of 5 · 89 results