playbook-icons v0.0.1-alpha.0
Playbook-Icons
What is Playbook Icons?
Playbook Icons is an open-source library with unique SVG icons, designed on a 24x24 pixels grid.
Browse at test-site.com →
Basic Usage
You can download any icon of the pack directly from https://test-site.com or get them from this repository.
Additionally, the icons are available via the power-icons
NPM package:
yarn add power-icons
# or
npm i power-icons
Example usage:
import Powergon from 'power-icons/icons/powergon.svg'
React
A React library is available to install under the name playbook-icons
. For more details, see the package README.
CSS
Import the CSS File:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/playbook-icons/playbook@main/css/playbook.css">
Here is an example in HTML:
<i class="playbook-hand-brake"></i>
The class must always be "playbook-" and then the name of the icon. You can find the names of the icons here.
The icons are display: inline-block
and default to the current font size. You can control this
by adjusting the ::before
styles of the element (which is where the icons are added as a mask).
Figma
The library is available in the Figma community here.
Swift Package
To add Playbook-Icons
to your Xcode project, follow these steps:
- In Xcode, open your project and navigate to File > Swift Packages > Add Package Dependency...
- Enter the repository URL:
https://github.com/playbook-icons/icons-swift.git
- Choose the branch or version you want to add, and click Next.
- Select the target where you want to use the package, then click Finish.
UIKit
import UIKit
import PlaybookIcon
let imageView = UIImageView(image: PlaybookIcon.bell.asUIImage)
SwiftUI
import SwiftUI
import PlaybookIcon
struct ContentView: View {
var body: some View {
PlaybookIcon.bell.asImage
.foregroundColor(.blue)
.font(.system(size: 24))
}
}
License
MIT License
5 months ago