roblox-gui · tabooharmony — Claude Code skill: what it does, how to install
Guidelines for Roblox UI development across mobile and console. Helps build responsive HUDs and menus without layout bugs.
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a claude-codeWhat roblox-gui does
The skill directs AI assistants to build and audit Roblox interfaces with a mobile-first mindset. Layouts start on the smallest landscape phone screen with touch controls before scaling up to larger devices. It enforces spacing around the top bar and virtual thumbstick using CoreUISafeInsets and measured AbsolutePosition. Overlapping elements trigger a reflow rather than simple shrinking.
Controller support relies on structured focus handling. The instructions demand a single SelectedObject owner, strict SelectionGroup boundaries, restored focus states, and layered Back navigation. On TV screens, the UI respects TV-safe areas and ViewportDisplaySize. Client buttons do not hold authority over server state. That boundary protects game logic from exploits.
Reactive UI patterns must implement per-screen cleanup to avoid memory leaks across open and close cycles. Loading interfaces belong in ReplicatedFirst.
What it helps with
- adapt Roblox UI layouts for phones and TV screens
- configure gamepad navigation boundaries with SelectionGroup
- fix HUD overlapping with Roblox touch controls and top bar
- clean up reactive UI listeners to stop memory leaks
Example prompts for the agent
- Review this shop menu layout for small mobile screens in Roblox
- Configure controller navigation for the inventory modal using SelectionGroup
- Set up a ReplicatedFirst loading screen that respects CoreUISafeInsets
How to install roblox-gui
1Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a claude-code2Manually: put the files in place
~/.claude/skills/roblox-gui/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/roblox-gui/
1Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a codex2Manually: put the files in place
.agents/skills/roblox-gui/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a cursor2Manually: put the files in place
.cursor/skills/roblox-gui/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install TabooHarmony/roblox-brain roblox-gui2Manually: put the files in place
.github/skills/roblox-gui/SKILL.md1Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a gemini-cli2Platform CLI
gemini skills install https://github.com/TabooHarmony/roblox-brain --path skills/gameplay/roblox-guiManually: put the files in place
.devin/skills/roblox-gui/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about roblox-gui
How to install roblox-gui in Claude Code?
Run npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a claude-code.
What does roblox-gui do?
It provides rules for building and auditing Roblox menus, HUDs, dialogs, and shops across phones and consoles. The guidelines cover safe insets, gamepad selection, and reactive cleanup.
How does roblox-gui handle gamepad navigation?
It enforces a single owner for SelectedObject, isolates focus inside SelectionGroup boundaries, and requires layered Back button handling.
Source text
SKILL.md · MIT
--- name: roblox-gui description: "Use when building or fixing Roblox menus, HUDs, shops, dialogs, or UI that must work on phones, tablets, desktop and console." when_to_use: "Also when changing or reviewing any UI, or when UI overlaps, is cut off, too small, misplaced or unreadable on mobile, a phone, tablet, TV or with a controller." last_reviewed: 2026-10-14 sources: - https://create.roblox.com/docs/ui - https://create.roblox.com/docs/ui/position-and-size - https://create.roblox.com/docs/ui/styling - https://create.roblox.com/docs/ui/list-flex-layouts - https://create.roblox.com/docs/input - https://create.roblox.com/docs/input/mobile - https://create.roblox.com/docs/production/publishing/console-guidelines - https://create.roblox.com/docs/studio/device-simulator - https://create.roblox.com/docs/reference/engine/classes/GuiService - https://create.roblox.com/docs/reference/engine/classes/ScreenGui - https://create.roblox.com/docs/projects/server-authority - https://create.roblox.com/docs/input/input-action-system - https://create.roblox.com/docs/reference/engine/classes/ReplicatedFirst - https://create.roblox.com/docs/reference/engine/classes/ContentProvider - https://create.roblox.com/docs/reference/engine/classes/UIPageLayout - https://create.roblox.com/docs/reference/engine/classes/SelectionBox - https://create.roblox.com/docs/reference/engine/classes/Decal - https://create.roblox.com/docs/reference/engine/classes/VideoPlayer - https://raw.githubusercontent.com/Roblox/focus-navigation/main/README.md - https://devforum.roblox.com/t/introducing-improvements-to-directional-ui-selection-on-gamepad/3864317 - https://devforum.roblox.com/t/what-are-the-best-ui-screeninset-settings-for-buttons/3519333 - https://devforum.roblox.com/t/screenguiscreeninsets-topbarinsets-regression/4047230 - https://raw.githubusercontent.com/Roblox/react-luau/main/README.md - https://raw.githubusercontent.com/dphfox/Fusion/main/README.md - https://raw.githubusercontent.com/centau/vide/main/README.md - https://raw.githubusercontent.com/ffrostfall/fluid/main/README.md - original --- # roblox gui ## When to Load HUDs, menus, shops, dialogs, world UI, and layout bugs on phone, tablet, desktop or TV. ## Quick Reference - Mobile first: design on the smallest landscape phone with touch controls, then grow (full.md §11). - Reserve top bar, thumbstick, jump, chat; interactive UI in `CoreUISafeInsets`; place by measured `AbsolutePosition`/`AbsoluteSize`. - Check every element pair that can show together; reflow, don't shrink. - Gamepad: one `SelectedObject` owner, `SelectionGroup` bounds, restored focus, layered Back (§8). - Console: TV-safe area, `ViewportDisplaySize`, no chat window. - Layouts own repeated layout; UI shows server state; a button is not an authority boundary. - Reactive UI: per-screen cleanup; repeat open/close to test leaks. Loading UI in `ReplicatedFirst`. - TextBox submit, grids, truncation, RichText safety, deprecated APIs: full.md. > Details: [references/full.md](references/full.md)
© TabooHarmony · MIT · TabooHarmony/roblox-brain
Similar skills
Everything for Game dev and 3D: Unity, Unreal, Godot, Blender →roblox-gui by other authors comes first.
