Skip to main content
Glama

Fluid CSS clamp()

css_clamp
Read-onlyIdempotent

Generate fluid CSS clamp() typography and spacing values that scale linearly from a small-viewport size to a large-viewport size, with output in rem or px and computed sizes at sample widths.

Instructions

Build a fluid typography/spacing value: CSS clamp() that grows linearly from a size at a small viewport to a size at a large viewport (sizes and viewports in px), expressed in rem or px. Also returns the computed size at sample viewport widths. Web version: https://s3eidat.github.io/css-units/

Input Schema

NameRequiredDescriptionDefault
unitNoOutput unit. Default rem.rem
maxSizeNoSize in px at the large viewport. Default 32.
minSizeNoSize in px at the small viewport. Default 16.
maxViewportNoLarge viewport width in px. Default 1280.
minViewportNoSmall viewport width in px. Default 320.
rootFontSizeNoRoot (html) font size in px, for rem. Default 16.
sampleViewportsNoViewport widths (px) to compute the resulting size at.

Schema Changelog

Changes observed during successful MCP inspections.

  1. First observedv0.1.0

TDQS

A3.7/5.0
Behavior4/5

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

Annotations already declare readOnly, idempotent, closed-world, so safety is covered. The description adds genuinely new behavioral context: the output is a clamp() expression plus computed sizes at sample viewport widths, which matters because there is no output schema. It omits edge-case handling, such as what happens when minSize exceeds maxSize or the viewports are inverted.

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

Conciseness4/5

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

Three short sentences, front-loaded with what is produced and followed by the return-value note. The trailing documentation URL is low-value for an agent that cannot browse and slightly dilutes an otherwise tight definition.

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?

For a seven-parameter, fully-defaulted, read-only generator with no output schema, the description covers the input model and gives a partial but useful account of the return value. A slightly fuller statement of the exact output shape would close the remaining gap.

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% and every parameter is self-documented with defaults, so the schema does the heavy lifting. The description only restates the units convention ('sizes and viewports in px') and the rem/px output choice, adding little beyond what the properties already declare; baseline 3 applies.

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

Purpose4/5

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

States a specific verb ('Build') and a precise resource ('fluid typography/spacing value: CSS clamp()') plus the linear-growth model, so an agent knows exactly what comes out. It doesn't name or contrast with the near siblings css_units and css_format, which is the only thing keeping it from a 5.

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?

Usage is implied by 'typography/spacing value' and the viewport framing, but the description never says when to reach for this instead of css_units or css_format, or what preconditions apply (e.g. min < max, minViewport < maxViewport). The agent must infer the selection rule.

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

Deploy Server

Other Tools