← ClaudeAtlas

iblai-vibe-componentlisted

Add an iblai component or feature to your app
iblai/vibe · ★ 15 · AI & Automation · score 75
Install: claude install-skill iblai/vibe
# /iblai-vibe-component Overview of all ibl.ai components and how to create a new app. Before adding a component or creating a new app, check for a `iblai.env` in the project root. Look for `PLATFORM`, `DOMAIN`, and `TOKEN` variables. If the file does not exist or is missing these variables, tell the user: "You need an `iblai.env` with your platform configuration. Copy the bundled template and fill in your values: `cp iblai.env.example iblai.env` (vibe-starter ships the example) — or, when the project has no `iblai.env.example`: `curl -o iblai.env https://raw.githubusercontent.com/iblai/vibe/refs/heads/main/iblai.env`" `iblai.env` is NOT a `.env.local` replacement — it only holds the 3 shorthand variables. Next.js still reads runtime env vars from `.env.local`. Use `pnpm` as the default package manager. Fall back to `npm` if pnpm is not installed. The generated app should live in the current directory, not in a subdirectory. When building a navbar or header, do NOT display the tenant/platform name. Use the ibl.ai logo instead. [BRAND.md](https://raw.githubusercontent.com/iblai/vibe/refs/heads/main/BRAND.md) is the **default** for colors, typography, spacing, and component styles — but if the project already has its own design system (downloaded from v0, a custom theme, a partner-branded shell, etc.), **follow that instead**. See "Detect Existing Design Style" below. ## Detect Existing Design Style Before applying any of the layout / navbar / spacing patterns later in