Atelier UI®

DocsCatalogShader StudioPricingGithub
Docs 1.0.0

tools

  • Browse Catalog
  • Shader Studio
    pro
  • Collage
    new

Documentation

  • How it works
  • License
  • MCP

Page Transition (04)

  • Clip Transition
  • Stripe Transition
  • Pixel Transition
  • Band Transition

Components (36)

  • Orbit Gallery
  • Sphere Gallery
  • Spiral Gallery
  • Glowing Fog
  • Gradient Flow
  • Halftone Glow
  • Scattered Grid
  • Tag Cloud
  • Edge Bounce
  • Fluid Distortion
  • Image Trail
  • Lens Media
  • Liquid Media
  • Magnetic Dot Grid
  • Pixel Media
  • Pixel Trail
  • Dither Cursor
  • Hover Burst
  • Image Bloom
  • Curve Media
  • Infinite Gallery
  • Infinite Parallax
  • Infinite Zoom
  • Pixel Scroll
  • Scattered Scroll
  • Elastic Stick
  • Letter Swarm
  • Magnify Trail
  • Stacking Grid
  • Wavy Scroll
  • Pixelated Text
  • Text Bounce
  • Text Fluid
  • Text Scramble
  • Falling Text
  • Text Roll

Foundation Blocks (07)

  • Smooth Scroll
  • Text Split
  • WebGL Image
  • WebGL Provider
  • WebGL Scene
  • WebGL Text
  • WebGL Video
Atelier UI 1.0.0 ©2026
Star on githubBuy me a coffeellms.txt
  1. Docs
  2. /
  3. Getting Started
  4. /
  5. License

License

Learn where your license key goes and what your agent writes with it.

  • Add your key
  • The registry entry

Most of the catalog is free and open source on GitHub, open to contributions. Other components require a one-time license that will also give you access to all upcoming features forever.


License key

Only required for pro components.

Sign in to view your license key.

Add your key

Put the key in a git-ignored .env.local at the root of your project:

.env.local
ATELIER_PRO_KEY=<your-license-key>
  • That's the whole setup: your agent will handles the rest.
  • What's next?: copy the prompt under the preview, same as a free component.
  • Your key is not exposed: your agent reads it through ${ATELIER_PRO_KEY} and never sees the value.

The registry entry

You never have to write this yourself unless you install manually or set up MCP. Your agent adds the @atelier entry to components.json the first time you install a pro component:

components.json
{
  "registries": {
    "@atelier": {
      "url": "https://www.atelier-ui.com/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${ATELIER_PRO_KEY}"
      }
    }
  }
}

Installing a free component writes the same entry without the header, as a plain string. Replace that string with the object above, or every pro install answers 401.

An entry pointing at an empty ATELIER_PRO_KEY stops every install, free components included.

Star on githubBuy me a coffeellms.txt