https://github.com/peteschaffner/framer-icon
Framer.js dynamically tinted icons based off of a template image.
https://github.com/peteschaffner/framer-icon
Last synced: 6 months ago
JSON representation
Framer.js dynamically tinted icons based off of a template image.
- Host: GitHub
- URL: https://github.com/peteschaffner/framer-icon
- Owner: peteschaffner
- Archived: true
- Created: 2015-05-25T07:48:31.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2015-07-08T10:11:46.000Z (over 10 years ago)
- Last Synced: 2025-04-04T03:45:54.476Z (7 months ago)
- Language: JavaScript
- Size: 1.78 MB
- Stars: 28
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-framer - framer-icon - Framer dynamically tinted icons based off of a template image. (Modules)
README
# Framer icon module
Dynamically tinted icons based off of a template image.
## Usage
```shell
$ cd .framer
$ npm install framer-icon
```
modules/myModule.coffee:
```coffeescript
exports.Icon = require "framer-icon"
```
app.coffee:
```coffeescript
{Icon} = require "myModule"
new Icon
width: 30
height: 30
image: "images/icon.png"
tintColor: "cornflowerblue"
```
## API
### `Icon#tintColor `
Get or set the tint color. Anything accepted by `Layer#backgroundColor` is
valid, with the addition of [CSS gradients][gradients]. `Icon#color` and
`Icon#backgroundColor` are aliases.
[gradients]: https://developer.mozilla.org/en-US/docs/Web/CSS/gradient