Skip to main content
Glama
1999AZZAR
by 1999AZZAR

generate_css_output

Generate framework-agnostic CSS output from a design style and palette, returning named files in vanilla, CSS Modules, SCSS, or css-variables-only formats.

Instructions

Generate framework-agnostic CSS output from a design style and palette. Supports vanilla CSS (tokens.css + base.css + components.css), CSS Modules (Button/Card/Input .module.css with all 8 states), SCSS (variables + mixins + BEM components), and css-variables-only (tokens with auto dark mode @media and [data-theme='dark']). Returns an array of named files ready to save to disk.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
styleYesDesign system slug (e.g. glass, neo-brutalism, minimal, material)
formatYesOutput format
paletteYesColor palette
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description must fully disclose behavior. It describes output as an array of named files ready to save, but lacks detail on side effects, idempotency, or authentication needs. This is adequate but not rich.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is two sentences with no unnecessary words. The first sentence states the core purpose, and the second lists formats efficiently. It is well-structured and front-loaded.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

The description covers output format and structure but does not explain how to obtain valid style or palette slugs (e.g., via list_options). Given the lack of output schema and annotations, some context is missing for a fully self-contained tool definition.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100%, so the description adds minimal value for parameter semantics. It repeats the purpose of 'style', 'palette', and 'format' with slight elaboration on format outputs, but does not enhance understanding beyond the schema.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool generates CSS output from a design style and palette, listing specific formats (vanilla, CSS Modules, SCSS, css-variables-only). This distinguishes it from sibling tools like generate_tailwind_config or generate_motion_snippet.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description implies usage for generating CSS output when a design style and palette are known, but it does not explicitly state when to use this tool versus alternatives, nor does it mention prerequisites like style availability.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Install Server

Other Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/1999AZZAR/the-designer'

If you have feedback or need assistance with the MCP directory API, please join our Discord server