https://github.com/lachlanjc/supercons
A friendly, open source React iconset
https://github.com/lachlanjc/supercons
icon-pack icons react react-icons
Last synced: 13 days ago
JSON representation
A friendly, open source React iconset
- Host: GitHub
- URL: https://github.com/lachlanjc/supercons
- Owner: lachlanjc
- License: bsd-3-clause
- Created: 2021-02-03T02:30:18.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2025-02-18T21:33:01.000Z (2 months ago)
- Last Synced: 2025-04-02T03:17:03.305Z (20 days ago)
- Topics: icon-pack, icons, react, react-icons
- Language: TypeScript
- Homepage: https://supercons.vercel.app
- Size: 638 KB
- Stars: 195
- Watchers: 2
- Forks: 8
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- my-awesome-list - supercons
README
# Supercons
A friendly set of open source React icons.
[→ **Preview & search the iconset**][docs]
[docs]: https://supercons.vercel.app
Massive credit to [@superbryntendo](https://github.com/superbryntendo) for the original set of icons & aesthetic inspiration.
Predecessor projects: [spectrum-icons](https://github.com/lachlanjc/spectrum-icons), [@hackclub/icons](https://github.com/hackclub/icons)

## Usage
```sh
yarn add supercons
# npm i supercons
``````js
import React from 'react'
import Icon from 'supercons'export default () => (
)
```Built with/supports TypeScript.
### Props
| Prop | Type | Default | Details |
| ------- | ---------------- | ------- | --------------------- |
| `glyph` | String, required | `like` | See [docs] |
| `size` | Number or string | `32` | Sets width & height |
| `as` | React component | `svg` | Must render `svg` tag |You can also pass any other props. Remember to make your icons accessible with `aria-label` or `title`, use `aria-hidden` if they’re purely decorative, etc.
## Development setup
1. Clone & enter the repo.
```sh
$ git clone https://github.com/lachlanjc/supercons.git
$ cd supercons
```2. Install dependencies.
```sh
$ yarn
```4. Run docs locally.
```sh
yarn run dev
```4. After making changes to icons, build the library.
```sh
yarn run prepare
```## To-do list
- [x] Drop PropTypes for TypeScript (thanks [@anirudhb](https://github.com/anirudhb)!)
- [x] Use [Microbundle](https://github.com/developit/microbundle) for build
- [ ] Allow tree-shaking by programatically generating a component for each icon
- [ ] Forward refs (with proper TypeScript support)
- [x] Add more icons