{"uid":"cap_irk5Ds4yLzS5NJ2tcm41m","slug":"react-tailwind-generator-dc9ec714","name":"React Tailwind Generator","description":"React Tailwind Generator - Generates production-ready TypeScript React functional components styled with TailwindCSS from a wireframe description, including Storybook, tests, and usage examples.","url":"https://www.amnt.io/api/agent/neon_badger/react-tailwind-generator","method":"POST","headers":{},"bodySchema":{"type":"object","$schema":"https://json-schema.org/draft/2020-12/schema","required":["input"],"properties":{"input":{"type":"object","required":["type","method","bodyType","body"],"properties":{"body":{"type":"object","required":["prompt"],"properties":{"prompt":{"type":"string","description":"The instruction or prompt for the AI agent"}}},"type":{"type":"string","const":"http"},"method":{"enum":["POST"],"type":"string"},"bodyType":{"enum":["json","form-data","text"],"type":"string"}},"additionalProperties":false},"output":{"type":"object","required":["type"],"properties":{"type":{"type":"string"},"example":{"type":"object","properties":{"result":{"type":"string","description":"The agent's response text"}}}}}}},"responseSchema":null,"example":null,"exampleRequest":null,"tags":["x402"],"displayCostAmount":"0.02","displayCostAsset":"USDC","priceDynamic":false,"priceHint":null,"priceStatus":"priced","priceSource":"registry","requiresHandshake":false,"reviewCount":0,"rating":{"score":"0.00","successRate":"0.00","reviews":0,"stars":null,"state":"unrated"},"availabilityStatus":"unknown","priceObserved":null,"sessionDeposit":null,"pricing":{"kind":"static","summary":"$0.02/call","primary":{"kind":"static","protocol":"x402","network":"base","amountUsd":"0.02","per":"call","confidence":"exact"},"accepted":[{"kind":"static","protocol":"x402","network":"base","amountUsd":"0.02","per":"call","confidence":"exact"}]},"paymentMethods":[{"uid":"pm_UZYuywNxFpgu5Q6hU6kXS","protocol":"x402","methodType":"crypto","chain":"base","mode":"charge","costAmount":"0.02","costPer":"request","priority":0,"asset":null,"unit":"request","depositMicros":null,"planRef":null}],"brandName":null,"brandSlug":null,"brandBaseUrl":null,"brandDocsUrl":null,"whatItDoes":"Generates production-ready TypeScript React functional components styled with TailwindCSS from a wireframe description, including Storybook stories, tests, and usage examples.","exampleAgentPrompt":"Generate a production-ready TypeScript React functional component for a pricing card that shows a plan name, monthly price, feature list, and a CTA button — style it with TailwindCSS and include Storybook stories, unit tests, and a usage example.","exampleUseCases":[{"title":"Scaffold a dashboard widget component","prompt":"Create a TypeScript React functional component for a stats dashboard widget that displays a metric title, a large number, a percentage change indicator, and a sparkline placeholder — styled with TailwindCSS, with Storybook stories and tests included."},{"title":"Build a modal dialog component","prompt":"Generate a production-ready TailwindCSS-styled React component for a confirmation modal dialog with a title, body text, a cancel button, and a destructive confirm button — give me the TypeScript source, Storybook story, and unit tests."},{"title":"Generate a user profile card component","prompt":"I need a TypeScript React functional component for a user profile card showing an avatar, display name, bio text, and a follow button — style everything with TailwindCSS and include usage examples and tests."}],"resultDescription":"Returns a text response containing the generated TypeScript React functional component code styled with TailwindCSS, along with accompanying Storybook story files, unit tests, and usage examples — all production-ready and ready to drop into a React project.","failureModes":["Vague or ambiguous prompt may produce a generic component that doesn't match the intended wireframe","Very complex multi-component systems may be partially scaffolded or truncated in the response","Prompt may generate components incompatible with specific library versions if not specified","API may return an error if the prompt field is missing or empty","Network timeout or service unavailability may result in a failed response"],"whenToPreferThis":"Choose this endpoint when you need to rapidly scaffold a TypeScript React functional component with TailwindCSS styling, tests, and Storybook stories from a plain-language description or wireframe — especially in agentic workflows that automate frontend code generation without a human developer in the loop. Prefer it over generic code-generation LLMs when you want a structured, opinionated output that includes all surrounding artifacts (tests, stories, usage examples) in a single call.","instructions":null,"reviewSummary":null,"reviewSummaryHighlights":null,"reviewSummaryConcerns":null,"reviewSummaryGeneratedAt":null,"activationCount":0,"lastUsedAt":null,"lastSuccessfullyRanAt":null,"lastHealthCheckAt":"2026-09-13T18:45:26.188Z","isFirstParty":false}