Two read-mostly endpoints that back our own dev tools: the SCSS mixins catalog (used by /dev/scss-mixins) and the CSS clamp() math (used by /dev/clamp-generator). Designed so LLM agents and CI scripts can pull the exact same answers our UI shows — without scraping the page.
# List all mixins (summary, no source)
curl "https://jinero.online/api/v1/dev/scss-mixins"
# Fluid font-size clamp from 16px → 48px
curl "https://jinero.online/api/v1/dev/clamp?min_fs=16&max_fs=48"const r = await fetch("https://jinero.online/api/v1/dev/scss-mixins?group=Project&fields=summary");
const { items, groups, count } = await r.json();Both endpoints are public and pure-PHP (no Node / Python). Generous limits, no cold-starts.
# Anonymous limits (per IP):
# GET /dev/scss-mixins 60 req/min
# GET /dev/scss-mixins/{id} 60 req/min
# GET /dev/clamp 60 req/minCatalog of every mixin we ship — Bootstrap re-exports, our own project mixins, common patterns, and SCSS placeholders. Filter by group, search across id/title/description, and decide whether you want just summaries or full source.
https://jinero.online/api/v1/dev/scss-mixins
| Parameter | Type | Description |
|---|---|---|
group |
string | One of the groups returned in the response (currently Bootstrap, Project, Pattern, Placeholder). Case-sensitive. |
search |
string | Fuzzy substring search across id, title, short description and long description. |
fields |
string | summary (default — no source code, lighter payload) or full (include scss / sass / less / demo). |
# Only Project mixins, with full source
curl "https://jinero.online/api/v1/dev/scss-mixins?group=Project&fields=full"
# Search
curl "https://jinero.online/api/v1/dev/scss-mixins?search=clamp"const r = await fetch("https://jinero.online/api/v1/dev/scss-mixins?fields=full");
const { items } = await r.json();
// Build an in-memory index
const byId = Object.fromEntries(items.map(m => [m.id, m]));{
"success": true,
"count": 27,
"groups": ["Bootstrap", "Project", "Pattern", "Placeholder"],
"items": [
{
"id": "centerer",
"title": "centerer()",
"group": "Project",
"short": "Absolute centering helper with axis toggles.",
"desc": "A practical utility when you need a badge, dot, handle, or overlay element pinned to the real visual center.",
"url": "https://jinero.online/dev/scss-mixins#centerer"
}
]
}Full source for one mixin in scss, sass and less syntaxes, plus a short demo snippet so you can preview usage. Use this from an agent that wants to drop a mixin straight into a project.
https://jinero.online/api/v1/dev/scss-mixins/{id}
| Parameter | Type | Description |
|---|---|---|
id |
string (path) | Mixin id from the list response (kebab-case slug, e.g. "centerer", "media-breakpoint-up"). |
curl "https://jinero.online/api/v1/dev/scss-mixins/centerer"const r = await fetch("https://jinero.online/api/v1/dev/scss-mixins/centerer");
const { mixin } = await r.json();
navigator.clipboard.writeText(mixin.scss);{
"success": true,
"mixin": {
"id": "centerer",
"title": "centerer()",
"group": "Project",
"short": "Absolute centering helper with axis toggles.",
"desc": "...",
"scss": "@mixin centerer($horizontal: true, $vertical: true) {\n position: absolute;\n ...\n}",
"sass": "@mixin centerer($horizontal: true, $vertical: true)\n position: absolute\n ...",
"less": "...",
"demo": "centerer",
"url": "https://jinero.online/dev/scss-mixins#centerer"
}
}Compute a fluid-scaling clamp() for typography or spacing. Returns the CSS string plus the underlying math (slope, intercept, vw coefficient) so you can drop the result into either CSS or SCSS pipelines. Math is byte-identical with our web tool at /dev/clamp-generator.
https://jinero.online/api/v1/dev/clamp
| Parameter | Type | Description |
|---|---|---|
min_fs |
number | Minimum size in px (typically font-size, but works for any length). |
max_fs |
number | Maximum size in px. |
min_vw |
number | Viewport width at which min_fs is reached. Default 320. |
max_vw |
number | Viewport width at which max_fs is reached. Default 1440. Must be > min_vw. |
unit |
string | px, rem (default), or both. Determines which variant the css field returns. |
root |
number | Root font-size in px for rem conversion. Default 16. |
# 16px → 48px between 320 and 1440 viewports
curl "https://jinero.online/api/v1/dev/clamp?min_fs=16&max_fs=48"
# Spacing token with px output
curl "https://jinero.online/api/v1/dev/clamp?min_fs=24&max_fs=64&min_vw=480&max_vw=1920&unit=px"const r = await fetch("https://jinero.online/api/v1/dev/clamp?min_fs=16&max_fs=48");
const { css, variants } = await r.json();
document.documentElement.style.setProperty("--fluid-fs", variants.rem);$res = Http::get("https://jinero.online/api/v1/dev/clamp", [
"min_fs" => 16,
"max_fs" => 48,
]);
$css = $res->json("css");{
"success": true,
"inputs": {
"min_fs": 16, "max_fs": 48,
"min_vw": 320, "max_vw": 1440,
"root": 16, "unit": "rem"
},
"math": {
"slope": 0.028571,
"intercept_px": 6.8571,
"vw_coefficient": 2.8571
},
"css": "clamp(1rem, 0.4286rem + 2.8571vw, 3rem)",
"variants": {
"px": "clamp(16px, 6.8571px + 2.8571vw, 48px)",
"rem": "clamp(1rem, 0.4286rem + 2.8571vw, 3rem)"
}
}Standard HTTP semantics. Errors return JSON with a "message" field.
// 404 — mixin id not found
{ "message": "Mixin not found" }
// 422 — invalid clamp inputs (e.g. max_vw <= min_vw)
{ "message": "max_vw must be greater than min_vw." }
// 422 — invalid step (must be 5, 10, 20 or 25 — for shades only, not relevant here)
{ "message": "The selected step is invalid." }
// 429 — rate limit exceeded
{ "message": "Too Many Attempts." }About the jinero.online Dev API
Free REST API for developer utilities — searchable SCSS mixin catalog with scss/sass/less variants, and deterministic CSS clamp() math for fluid typography and spacing.
Mixin catalog as API
Every mixin our SCSS library ships with — Bootstrap re-exports, project utilities, design patterns, placeholders — exposed as JSON with id, group, search-friendly fields and full source.
scss · sass · less
Each mixin comes back in three syntaxes. Pick the one your build pipeline expects without manual translation.
Deterministic clamp math
The clamp() math is pure-PHP and identical to the JS implementation our /dev/clamp-generator UI uses — same rounding, same output strings.
No build step required
Both endpoints are read-mostly, pure-PHP, no Node or Python in the loop — fast first response and predictable cost.
Frequently Asked Questions
No. Both endpoints are public and rate-limited to 60 req/min per IP. Sign up for a token if you need higher limits for batch agent work.
They are bundled JSON catalogs at storage/app/mixins/ — bootstrap.json, project.json, project-extra.json, patterns.json, placeholders.json. Editing those files (and a redeploy) is the only way to add mixins for now; we may move them to the database later if user contributions become a thing.
A full catalog with scss/sass/less source for 27 mixins is ~80 KB. Most clients just want the index for navigation, then fetch one mixin at a time. Pass fields=full when you want everything in one round-trip.
Yes — slope = (maxFs - minFs) / (maxVw - minVw); intercept = minFs - slope * minVw; clamp(minFs, intercept + slope*100vw, maxFs). We compute the rem variant relative to root (default 16px). Output strings are trimmed of trailing zeros for readability.
The web tool offers a SCSS function wrapper, but the API returns the raw CSS clamp() expression — wrap it client-side if you need a SCSS function. We may add a scss_fn field if there is demand.