libraryget access

roblox ui library for ai agents

give your ai a real ui library. full of quality roblox ui, so it builds great screens, fast.

800+ game UI components from 11 packs — shops, HUDs, battle passes, inventories and more. Connect it to your AI, ask for a screen, and it builds it in Roblox Studio for you.

start free browse the library
Real slots-anime components, placed at their stored offsetInParent.

11 packs of ready-made roblox ui

    the library

    a big library,made by real ui designers

    Shops, HUDs, battle passes, inventories and more, in many different styles. Scroll through what your AI gets to work with.

      parts
      —
      atomic
      —
      packs
      —

      easy to edit

      not just pictures,real pieces your ai can rearrange.

      Every component comes split into its parts — background, buttons, icons, text. Your AI can move them, resize them and change the words, so the screen fits your game.

      slots-anime/slot-info
      composite285×4158 children
        The Slot Info card from the Slots Anime pack, separated into its real child images: background panel with 9-slice insets, effects, level bar, equip and delete buttons, stat icons, and a live text layer rendered in Fredoka One.

        made of parts

        Each component is built from smaller pieces your AI can reuse on their own. Hover one to see what it’s made of.

        text stays text

        Text stays editable, in the original font and colors. Your AI can write whatever your game needs. Type to try it.

        notext@2x.png + TextLabel

        built to fit

        your ai knows every piece,so it doesn’t have to guess.

        Every component comes with the details your AI needs — size, fonts, colors and where it goes. That’s why the screens come out clean, not messy.

        X Button from the Season Pass UI pack: a red, slanted close button with a white Montserrat x
        The X Button component with overlays that draw each manifest field onto the art.
        manifest.json

        resizes without breaking

        Panels and buttons stretch to any size and keep their corners and borders sharp. Drag to try it.

        everything matches

        Your AI builds each screen from one pack, so the shop, the header and the close button all share the same style.

        season-pass

        palette

          fonts

            text sizes

              how it works

              describe the screen,your ai builds it in studio

              Write one sentence, like “a shop with two gamepass cards and a close button”. Your AI finds the right pieces in the library and builds the screen in Roblox Studio for you.

              Example: the prompt “build me a shop screen with two gamepass cards and a close button” leads the agent to call search_components, get_component and compose_screen on the penui MCP server. compose_screen returns one Luau script that the Roblox Studio MCP runs with execute_luau, creating a ScreenGui named ShopScreen built from stud-shop components.

              works with your ai

              Claude, Cursor, Windsurf or any other tool that supports MCP. Add a short config entry and it’s connected.

              Clients: Claude Code, Claude Desktop, Cursor, Windsurf, Zed.

              .mcp.json
              {
  "mcpServers": {
    "penui": {
      "command": "node",
      "args": ["mcp/server.mjs"]
    }
  }
}

              no uploads needed to start

              Your AI can build buttons, panels and bars out of Roblox’s own parts, so you can try it right away. Upload the images later for the exact look.

              native · no upload
              uploaded art · ImageLabel
              Home button from the skibidifig pack, original art
              1. FrameBackgroundColor3 137, 196, 255
              2. UICornerCornerRadius 6
              3. UIGradientRotation 90 · two-stop ColorSequence
              4. UIStrokeThickness 4 · Border
              5. TextLabel“Home” · Inter Heavy 40 · UIStroke 3

              Icons and detailed art need their images on Roblox. Your AI can upload them for you with a Roblox Open Cloud key.

              get started

              stop placing frames by hand,let your ai build the ui

              Start free with 3 packs. Want the full library? Compare plans.

              .mcp.json
              {
  "mcpServers": {
    "penui": {
      "command": "node",
      "args": ["mcp/server.mjs"]
    }
  }
}

              stdio · node 20+ · works with any MCP client

              questions

              Which AI tools work?

              Any MCP-capable client: Claude Code, Claude Desktop, Cursor, Windsurf, Zed and others. The server speaks standard MCP over stdio and needs Node 20+.

              Do I need to upload images to Roblox?

              No, not to start. Your AI builds buttons, panels and bars from Roblox’s own parts. For the exact art, the images get uploaded once — your AI can do it with an Open Cloud key, or you can do it by hand.

              Does it hold up on phones and odd screen sizes?

              Yes. Screens scale to fit any device, and panels stretch without warping their corners.

              Can my AI change colors or text?

              Yes. Every piece stays editable — text, colors, size and position.

              Where do the designs come from?

              From Figma files made by UI designers, turned into Roblox-ready pieces. Check each pack’s license before you redistribute it.

              How much does it cost?

              Starter is free forever, with 3 packs. Paid plans unlock the whole library from €15/mo billed annually — see the full breakdown on the pricing page.