REQUIRED when modifying any file in packages/playground-ui or packages/playground. Triggers on: React component creation/modification/refactoring, UI changes, new playground features, bug fixes affecting studio UI. Generates Playwright E2E tests that validate PRODUCT BEHAVIOR, not just UI states.
npx skills add https://github.com/mastra-ai/mastra/tree/main/skills/e2e-tests-studioREQUIRED when modifying any file in packages/playground-ui or packages/playground. Triggers on: React component creation/modification/refactoring, UI changes, new playground features, bug fixes affecting studio UI. Generates Playwright E2E tests that validate PRODUCT BEHAVIOR, not just UI states.
This repo contains 4 individual skills — each has its own dedicated page.
Interactive planning assistant that helps create focused, well-structured ralph-loop commands through collaborative conversation
React performance optimization guidelines from Mastra Engineering. This skill should be used when writing, reviewing, or refactoring React code to ensure optimal performance patterns. Triggers on tasks involving React components, data fetching, bundle optimization, or performance improvements.
Create a Mastra project using create-mastra and smoke test the studio in Chrome using Chrome MCP server
Tailwind CSS styling guidelines for Mastra Playground UI. This skill should be used when writing, reviewing, or refactoring styling code in packages/playground-ui and packages/playground to ensure design system consistency. Triggers on tasks involving Tailwind classes, component styling, or design tokens.
Build responsive, accessible UI components and layouts using Chakra UI v3, install or configure Chakra UI in new and existing projects, and design scalable themes using tokens, semantic tokens, recipes, and slot recipes. Use this skill whenever a user asks to build, create, or generate any UI component, page, form, dashboard, navbar, card, landing section, pricing table, or layout using Chakra UI; wants to add Chakra UI to a project, set up ChakraProvider, run CLI snippets, configure color mode, or fix provider wrapping; or asks about theming — defining brand colors, design tokens, semantic tokens, dark mode values, component recipes, slot recipes, typegen, or ejecting the default theme. Trigger on any Chakra UI building, setup, or theming or charts request, however casually phrased — "add my brand colors", "make a reusable card style", "build a bar chart", "show me a line chart", "make me a login form", "build a sidebar", "add Chakra to my app".
The first dedicated Claude Code skill suite for building on Hedera Hashgraph, fourteen production-grade skills covering Hedera Ecosystem.
Tailwind CSS utility-first CSS framework. Use when styling web applications with utility classes, building responsive designs, or customizing design systems with theme variables.
Open-source Claude skills for real estate agents — Fair Housing compliant by default. 19 skills covering listings, offers, lead nurture, BoldTrail bridge, MLS-to-social, and the full Canva stack. Built by Al & Victoria Pinder, ICON agents at eXp Realty.
JPA/Hibernate patterns for entity design, relationships, query optimization, transactions, auditing, indexing, pagination, and pooling in Spring Boot.
AotterMantle SDK: agent-native CMS runtime, manifests, admin UI, and Cloudflare adapter.