Skip to main content
Glama

CSS Gradient Generator

gradient_generator
Read-onlyIdempotent

A CSS gradient generator for linear, radial and conic — copy the code straight out. A HelpySelf tool (helpyself.com).

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
typeNoThe kind of CSS gradient: 'linear' runs in a straight line at the angle, 'radial' spreads out from the centre, 'conic' sweeps round the centre.linear
angleNoDegrees, normalised to 0-359. For linear it is the direction the gradient runs, 0 pointing up and 180 down; for conic it is where the sweep starts. Ignored for radial.
shapeNoFor radial gradients only: 'circle' keeps the rings round, 'ellipse' stretches them to the box. Ignored for linear and conic.ellipse
stopsYesThe colours in order, from 2 to 16 of them.
repeatingNoEmit the repeating-* variant, which tiles the gradient over the box instead of stretching it once. Only visible when the stops have explicit positions short of 100.

Schema Changelog

Changes observed during successful MCP inspections.

  1. Changed8 schema fields changed
    • addedInput schema / properties / angle / description
      Added value: +"Degrees, normalised to 0-359. For linear it is the direction the gradient runs, 0 pointing up and 180 down; for conic it is where the sweep starts. Ignored for radial."
    • addedInput schema / properties / repeating / description
      Added value: +"Emit the repeating-* variant, which tiles the gradient over the box instead of stretching it once. Only visible when the stops have explicit positions short of 100."
    • addedInput schema / properties / shape / description
      Added value: +"For radial gradients only: 'circle' keeps the rings round, 'ellipse' stretches them to the box. Ignored for linear and conic."
    • addedInput schema / properties / stops / description
      Added value: +"The colours in order, from 2 to 16 of them."
    • addedInput schema / properties / stops / items / description
      Added value: +"One colour stop."
    • addedInput schema / properties / stops / items / properties / colour / description
      Added value: +"Any CSS colour: a hex code, rgb(), hsl() or a named colour."
    • addedInput schema / properties / stops / items / properties / position / description
      Added value: +"Where along the gradient this colour sits, as a percentage from 0 to 100. Omit it and CSS spaces the stop evenly between its neighbours."
    • addedInput schema / properties / type / description
      Added value: +"The kind of CSS gradient: 'linear' runs in a straight line at the angle, 'radial' spreads out from the centre, 'conic' sweeps round the centre."
  2. First observed

TDQS

A3.8/5.0
Behavior3/5

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

Annotations already declare readOnlyHint=true, idempotentHint=true, and destructiveHint=false, so the safety profile is covered. The description adds that it copies the code straight out, which implies the output is CSS code, but it does not elaborate on any other behaviors or requirements. This adds minimal value beyond the annotations.

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 a single sentence that front-loads the purpose and key features (linear, radial, conic, copy code). There is no wasted text; it is concise and well-structured.

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

Completeness4/5

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

The tool is simple, the schema fully documents parameters, and annotations cover safety. The description mentions 'copy the code straight out,' which sufficiently indicates the output is CSS code, even without an output schema. It is complete enough for an agent to call correctly, though it could explicitly mention the output format more clearly.

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 description coverage is 100%, with all five parameters documented in detail (type, angle, shape, stops, repeating). The description itself adds no parameter-specific information, so it relies entirely on the schema. Baseline 3 is appropriate.

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 it is a CSS gradient generator for linear, radial, and conic gradients, with the specific action of copying the code. This is a specific verb+resource that distinguishes it from other tools, and there are no sibling gradient tools to confuse it with.

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 does not explicitly state when to use this tool versus alternatives, though no direct alternatives exist among siblings. The use case is implied by the name and description ('generator'), but there is no explicit guidance on when to choose it or any exclusions. This is adequate but not explicit.

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

Try in Browser

Glama MCP Gateway

Add one secure layer between your agents and this server.

Resources