star Features

Everything Sednicon supports out of the box.

bolt Quick Start

The easiest way to use Sednicon — drop this into any HTML page:

<img
  src="https://sednicon.sednium.com/api/render?q=rocket&color=000000&size=64"
  alt="rocket"
/>

That's it. The icon will be generated automatically.

tune API Reference

Endpoint

GET https://sednicon.sednium.com/api/render

Query Parameters

All parameters are passed as query strings to the /api/render endpoint.

Examples

https://sednicon.sednium.com/api/render?q=rocket

https://sednicon.sednium.com/api/render?q=rocket&color=ff0000

https://sednicon.sednium.com/api/render?q=rocket&size=128

https://sednicon.sednium.com/api/render?q=rocket&color=000000&size=64

html HTML

Drop a URL into any <img> tag. Works in Webflow, WordPress, Framer, and raw HTML — no build step required.

<img
  src="https://sednicon.sednium.com/api/render?q=home&color=0066ff&size=64"
  alt="Home Icon"
/>

brush CSS Background

Use as a background-image for styled buttons, pseudo-elements, or any element that needs an icon without extra markup.

.icon-rocket {
  width: 64px;
  height: 64px;
  background-image: url("https://sednicon.sednium.com/api/render?q=rocket&color=000000&size=64");
  background-size: 64px 64px;
}

code React

Create a reusable component:

function Icon({ name, color = "000000", size = 64 }) {
  return (
    <img
      src={`https://sednicon.sednium.com/api/render?q=${name}&color=${color}&size=${size}`}
      alt={name}
    />
  );
}

Usage:

<Icon
  name="rocket"
  color="ff6600"
  size={80}
/>

layers Vue

Bind the icon URL reactively using a template expression. Works with Vue 3 Composition or Options API.

<img
  :src="`https://sednicon.sednium.com/api/render?q=rocket&color=000000&size=64`"
  alt="rocket"
/>

widgets Framework Support

Sednicon works anywhere an <img> tag or URL can be used, including:

error_outline Error Handling

Invalid Icon

If the requested icon name can't be matched in any icon set, example response:

404 Icon not found

Invalid Parameter

If a parameter value is malformed (e.g. an invalid hex color or non-numeric size):

400 Invalid parameter

speed Performance Recommendations

For better performance:

• Use common sizes: 16px, 24px, 32px, 48px, 64px, 128px
• Cache generated icons whenever possible (e.g. via CDN edge caching or browser cache headers)

API Versioning

Future versions may use:

/api/v1/render

This ensures compatibility with future updates.

map Roadmap

Completed

• Basic icon rendering API
• Color customization
• Size customization
• 200,000+ icon search via Iconify
• Multi-set fallback chain

Planned

• More icon collections
• SVG optimization
• SDK packages
• Official framework components

gavel License & Credits

Sednicon is released under the MIT License and is free to use, including for commercial projects.

Icons are sourced from the open-source Iconify project, including Material Symbols, Lucide, Simple Icons, and other community icon sets — each retaining their respective open-source licenses.

Built by Sednium. Source code available on GitHub.

Contributing

Suggestions and improvements are welcome — help make Sednicon a better icon API for developers. Open an issue or pull request on GitHub.