OpenIcons
The MIT fork of PrimeIcons.
OpenIcons started from PrimeIcons and goes its own way from there. Every original name and codepoint still works, and on top of them come new icons and Vue 3 components.
npm install @openvue/openiconsA webfont for any page
Load one stylesheet and add a class. It works with any framework or none at all, and the class names follow the ones you already know from PrimeIcons.
Webfont guide<link rel="stylesheet"
href="https://unpkg.com/@openvue/openicons/openicons.css">
<i class="oi oi-check"></i>
<i class="oi oi-spin oi-spinner"></i>Vue components for apps that bundle
Each icon is its own component and renders a real SVG. Your bundler keeps only what you import, so two icons add about 1.3 KB.
Vue guide<script setup>
import OiCheck from '@openvue/openicons-vue/icons/OiCheck';
</script>
<template>
<OiCheck :size="20" title="Saved" />
</template>Moving off PrimeIcons is one line
Change the import. A compatibility stylesheet maps every pi- class onto the new font, so your templates stay as they are. Rename to oi- later, or never.
// main.js
import 'primeicons/primeicons.css';
import '@openvue/openicons/primeicons.css'; Codepoints don't move
A release can add icons. It never renames, removes or renumbers one that already exists, and CI checks that on every pull request. Upgrading won't change what's on your screen.
How versioning works| Icon | Class | Component | Codepoint |
|---|---|---|---|
| oi-check | OiCheck | U+E909 | |
| oi-times | OiTimes | U+E90B | |
| oi-search | OiSearch | U+E908 | |
| oi-trash | OiTrash | U+E93D |
A project of the OpenVi Foundation
The OpenVi Foundation is an independent group of developers who use these libraries in production and keep them maintained and open. OpenIcons is developed alongside OpenVue, the component library that uses it.
Missing an icon?
Open an issue and tell us where you'd use it. New icons are drawn on the same 24×24 grid and at the same weight as the rest of the set, and reviewed before they ship.