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: 2 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 9 years ago)
• Default Branch: master
• Last Pushed: 2015-07-08T10:11:46.000Z (over 9 years ago)
• Last Synced: 2024-10-31T17:47:13.924Z (2 months ago)
• Language: JavaScript
• Size: 1.78 MB
• Stars: 28
• Watchers: 3
• 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