Xcojo Icon Engine & Developer Guide

🔌 Direct Usage

Reference any icon straight from an <img> tag — no build step, no bundling:

<img src="https://dev.xcojo.com/Icon/?name=search&size=24&color=%23007aff" alt="Search">

Recoloring with CSS (inline SVG)

An <img> tag's color is fixed by the URL. To recolor an icon dynamically with CSS (e.g. on hover), fetch and inline the SVG so it inherits currentColor:

fetch('https://dev.xcojo.com/Icon/?name=heart&color=currentColor')
    .then(r => r.text())
    .then(svg => {
        document.getElementById('icon-slot').innerHTML = svg;
    });

/* then in CSS */
#icon-slot svg { color: #ff3b30; } /* or :hover, var(--accent), etc. */

JSON Response (raw path data)

https://dev.xcojo.com/Icon/?name=search&format=json

README & Developer Guide

Welcome to the Xcojo Icon Engine & API. A general-purpose UI icon set for buttons, nav, and status indicators across xcojo.com properties — separate from the Favicon Engine, which only covers brand/app icons.

API Parameters

name: Icon identifier, e.g. search, heart, chevron-down (required)
size: Pixel dimensions, 12–512 (default: 24)
color: Any CSS color value, URL-encoded, e.g. %23007aff for #007aff, or currentColor (default: currentColor)
stroke: Stroke width, 1–4 (default: 2)
format: svg (default) or json for raw path data

Full Icon List

alert-triangle, arrow-left, arrow-right, bell, calendar, cart, check, check-circle, chevron-down, chevron-left, chevron-right, chevron-up, clock, copy, download, edit, external-link, eye, eye-off, filter, globe, heart, home, info, lock, mail, menu, minus, phone, plus, refresh, search, settings, share, star, trash, upload, user, x, x-circle

Design Notes

All icons share a 24×24 viewBox, round line caps/joins, and no fill by default (pure stroke), so they sit consistently at any size. Each is an original design built from basic SVG primitives — not sourced from any third-party icon library.

Cross-Origin Integration (CORS)

All endpoints include automatic CORS headers (Access-Control-Allow-Origin: *) and long-lived caching, since icon designs change rarely.

🧩 Icon Library