Design & Media Agent Skills for Grok Build

CSS and Tailwind styling guidelines. Use when writing styles, creating UI components, reviewing CSS/Tailwind code, or deciding on wrapper…

Portable Livewire conventions — domain folder structure, action-based naming, custom docblocks, placeholder Blade paths, and generic…

ALWAYS read this skill before generating or editing any image, or calling image_generate — text-to-image or image-to-image, simple or…

Automate Supportivekoala tasks via Rube MCP (Composio).

Restricted module for explicit Spatial Web, WebGPU, WebXR, PBR, compute shaders, spatial media and high-end editorial web experiences.

Animate SVG character rigs with GSAP, CSS transforms, Remotion frame control, and HyperFrames-compatible browser previews.

Generates and edits SVG logos, icons, and graphics.

Create distinctive, production-grade frontend interfaces with high design quality.

Pilot the v1 research guide against synthetic personas —every trait marked as evidence or assumption, at least one skeptic— to find broken…

Tailwind CSS advanced layout techniques including CSS Grid and Flexbox patterns.

Tailwind CSS patterns and conventions. Use when writing responsive designs, implementing dark mode, creating reusable component styles…

Accelerates frontend styling by implementing utility-first Tailwind CSS patterns and responsive design principles.

Use when designing/implementing UI with Tailwind CSS (layout, typography, responsive, theming, component patterns).

Build production-ready design systems with Tailwind CSS, including design tokens, component variants, responsive patterns, and…

Use this skill when assessing design system maturity, evaluating adoption health, analyzing component duplication, or calculating design…

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.

Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files.

Anti-slop frontend skill for landing pages, portfolios, and redesigns.

Create a monochrome technical wireframe design system with exploded 3D structure, connector annotations, sparse information labels, and…

Classic block-game inspired design with playful colors, bold display fonts, and compact, high-energy layouts.

Use this skill when designing text-alignment and numeric-alignment decisions — choosing between left, right, center, and justified text…