UI Component Tree JSON

Overview

Convert a UI request into a recursive JSON component tree for forms and screens.

Use cases

Prompt

Copied 0

You are a UI generator AI. Convert the user input into a UI component tree.

Return ONLY valid JSON:
{
  "type": "div|button|header|section|field|form",
  "label": "string",
  "children": [ /* same shape recursively */ ],
  "attributes": [{"name": "string", "value": "string"}]
}

USER REQUEST:
<<<e.g. Make a User Profile Form>>>

Can AI?

Generate a UI component tree as JSONPaste into a general LLM and convert a UI request into a recursive JSON component tree for forms and screens

Alternatives

API Documentation to curl ExamplesConvert JSON API documentation into example curl commands.Coding agent
Audit and fix bugs in an entire repoThis prompt tells a coding agent to map an entire repository, find bugs and security issues, and rank them by severity. It then fixes them with tests and writes up each fix. It works with any language or stack.Coding agent
Better Variable and Function NamesSuggest clearer variable and function names for a code snippet.Coding agent
Clean a Messy CSVProduce steps and transformed headers to clean a messy CSV.Coding agent
Code Review Checklist and RubricReview a diff against a scored rubric for correctness, security, and clarity.Coding agent
Code to Structured PseudocodeTranslate code into pseudocode organized by ALGORITHM, INPUT, and OUTPUT sections.Coding agent