Back to Plugins
GL Shader Studio

GL Shader Studio

Generate stunning animated textures and backgrounds directly in Figma with WebGL

Plugin Preview

GL Shader Studio preview

About this plugin

GL Shader Studio


A Figma plugin that creates dynamic backgrounds, textures, and image fills using real-time GLSL shaders with WebGL rendering.


Transform your designs with cinema-quality animated backgrounds, gradients, and textures. Whether you are a developer or a designer, creating complex shaders has never been easier.


✨ NEW: AI Shader Generation


  1. Create custom effects instantly using Google Gemini. Simply enter your own API key to start generating.
  2. Just describe what you want "pulsing sci-fi grid" or "abstract oil painting" and the AI generates the code and adjustable controls automatically.


Privacy Note:


  1. We use a "Bring Your Own Key" system. your key is never saved or tracked. It is strictly used for your session and discarded once the plugin is closed.


Key Features:


  1. Text-to-Shader: Generate unique effects instantly with AI.
  2. Visual Builder: Stack effects like noise and shapes without coding.
  3. Video Export: Render 1080p loops for social media or prototypes.
  4. Real-time Preview: Adjust speed, colors, and density live.
  5. Pro Editor: Full GLSL syntax highlighting for advanced users.

Plugin Details

Version10
CreatedNovember 11, 2025
Last UpdatedDecember 18, 2025
Categoryediting & effects plugins
CreatoriSandRocks
Stats27 installs, 6 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://generativelanguage.googleapis.com