Pine Icon Library

A simple way to add beautiful icons to your web projects using Kajabi's Pine Design System. These icons work in any modern browser and are easy to customize.


What's Included

- Ready-to-use SVG icons that load fast
- Works in any modern browser
- Easy to change colors and sizes
- Works with TypeScript
- Built for accessibility

Quick Start

Choose one of these two simple ways to start:

$3

Add this line to your HTML:
``html

`

How to Use Icons

$3


`html

`

$3

Change the size:
`html








`

Change the color:
`html

`

$3

| Option | What it Does | Default | Examples |
|--------|-------------|---------|-----------|
| name | Picks which icon to show | Required | "menu", "close" |
| size | Sets icon size | "regular" (16px) | "small", "medium", "24px" |
| color | Changes icon color | Matches text color | "#663399", "blue" |

Need Help?

$3

1. Icons not showing up?
- Check that you added the script correctly
- Make sure you're using the right icon name
- Check your browser's console for errors

2. Build issues?
- Make sure you have Node.js version 22.7.0 or newer
- Try running npm install to reinstall everything

$3

Found a bug or need a new feature? Open an issue

Want to Contribute?

We welcome help! Here's how to get started:

1. Fork the project
2. Clone your fork:
`bash
git clone https://github.com/YOUR_USERNAME/pine-icons.git
cd pine-icons
`
3. Install what you need:
`bash
npm install
`
4. Start the development server:
`bash
npm start
`
This runs on port 7200 and shows your changes live.

5. Make your changes and test them:
`bash
npm test
``

6. Create a pull request with your changes

$3

- Node.js v22.7.0 or newer
- npm (comes with Node.js)
- Git