gradeNot graded
get_theme_cssAnswer
Get the current Tailwind v4 theme CSS. Returns the contents of the theme.css editor, which contains the @theme block with design tokens (colors, border radius, font sizes, shadows, spacing) and dark mode overrides.
View tool JSON
{
"name": "get_theme_css",
"kind": "answer",
"impl": "imperative",
"description": "Get the current Tailwind v4 theme CSS. Returns the contents of the theme.css editor, which contains the @theme block with design tokens (colors, border radius, font sizes, shadows, spacing) and dark mode overrides.",
"inputSchema": {
"type": "object",
"properties": {}
},
"page": "/tailwind-playground/"
}set_theme_cssAction
Replace the Tailwind v4 theme CSS. Accepts a full CSS string containing a @theme block with design tokens and optional .dark overrides. Updates the editor and live preview, then focuses the window so the user can see changes.
View tool JSON
{
"name": "set_theme_css",
"kind": "act",
"impl": "imperative",
"description": "Replace the Tailwind v4 theme CSS. Accepts a full CSS string containing a @theme block with design tokens and optional .dark overrides. Updates the editor and live preview, then focuses the window so the user can see changes.",
"inputSchema": {
"type": "object",
"properties": {
"css": {
"type": "string",
"description": "Complete CSS string with @theme { ... } block and optional .dark { ... } overrides"
}
},
"required": [
"css"
]
},
"page": "/tailwind-playground/"
}get_sandbox_htmlAnswer
Get the current sandbox HTML. Returns the contents of the sandbox.html editor, which contains HTML using Tailwind utility classes rendered in the live preview.
View tool JSON
{
"name": "get_sandbox_html",
"kind": "answer",
"impl": "imperative",
"description": "Get the current sandbox HTML. Returns the contents of the sandbox.html editor, which contains HTML using Tailwind utility classes rendered in the live preview.",
"inputSchema": {
"type": "object",
"properties": {}
},
"page": "/tailwind-playground/"
}set_sandbox_htmlAction
Replace the sandbox HTML. Accepts an HTML string using Tailwind utility classes. Updates the editor and live preview, then focuses the window so the user can see changes.
View tool JSON
{
"name": "set_sandbox_html",
"kind": "act",
"impl": "imperative",
"description": "Replace the sandbox HTML. Accepts an HTML string using Tailwind utility classes. Updates the editor and live preview, then focuses the window so the user can see changes.",
"inputSchema": {
"type": "object",
"properties": {
"html": {
"type": "string",
"description": "HTML string using Tailwind utility classes. Use semantic tokens like bg-surface, text-foreground, border-border for dark mode compatibility."
}
},
"required": [
"html"
]
},
"page": "/tailwind-playground/"
}list_templatesAnswer
List available canned templates. Returns template names and descriptions that can be loaded with the select_template tool.
View tool JSON
{
"name": "list_templates",
"kind": "answer",
"impl": "imperative",
"description": "List available canned templates. Returns template names and descriptions that can be loaded with the select_template tool.",
"inputSchema": {
"type": "object",
"properties": {}
},
"page": "/tailwind-playground/"
}select_templateAction
Load a canned template by name. Replaces both the theme CSS and sandbox HTML with the template content, updates the dropdown, editors, and live preview, then focuses the window.
View tool JSON
{
"name": "select_template",
"kind": "act",
"impl": "imperative",
"description": "Load a canned template by name. Replaces both the theme CSS and sandbox HTML with the template content, updates the dropdown, editors, and live preview, then focuses the window.",
"inputSchema": {
"type": "object",
"properties": {
"name": {
"type": "string",
"description": "Template name from list_templates (e.g. \"Design System\", \"Hero — Gradient\")"
}
},
"required": [
"name"
]
},
"page": "/tailwind-playground/"
}