# Roids

> Use when presenting more than one comparable UI direction, or proactively whenever you ship multiple layout options for the user to choose—do not wait for the user to mention Roids or type /roids. Use for comparison, preview-first, or pick-a-winner flows before cleanup. Default to a small set of variants (~2–5) unless the user specifies how many.

- Skill: `hexclave/roids` (Agent Skill)
- Install (CLI): `npx skillmds@latest add hexclave/roids`
- Raw SKILL.md: https://api.skillmd.com/api/skills/hexclave/roids/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: hexclave (https://skillmd.com/u/hexclave)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/hexclave/roids

---


# Roids

Compare variants in the browser with the hosted runtime and markup contract.

## How it works

**Preview-only — not for production.** The TryRoids hosted runtime (`https://tryroids.com/roid-tool.js`) and any wiring described in `SKILL.txt` are intended only for sandboxed variant previews. Never include them in production dashboard or app code, and never inject a `<script src="https://tryroids.com/roid-tool.js">` into shipped bundles.

1. Fetch the source URL below for documentation only—do not load it via `<script src>` in production code.
2. Follow `SKILL.txt` exactly: "wire" means using the documented inline markup pattern (the `data-roid-*` attributes on variant elements) inside a sandboxed preview runner. The hosted runtime URL is referenced in docs or loaded only by the preview sandbox, never by application code.
3. Do not use custom tabs, selects, or one-off pickers for those variants.

## Source

`https://tryroids.com/SKILL.txt`