# grunt-app-icons
> Create App Icons: favicon, touch, android, ios
Latest version **1.0.5** (published 2015-07-08) · MIT license · 0 weekly downloads
## Install
```sh
npm install grunt-app-icons
pnpm add grunt-app-icons
yarn add grunt-app-icons
bun add grunt-app-icons
```
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 1.0.5 |
| Published | 2015-07-08 |
| First published | 2014-10-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | Carl Craig |
| Maintainers | carlcraig |
## Links
- npm: https://www.npmjs.com/package/grunt-app-icons
- Repository: https://github.com/carlcraig/grunt-app-icons
- Issues: https://github.com/carlcraig/grunt-app-icons/issues
- npm.io page: https://npm.io/package/grunt-app-icons
## Dependencies (2)
- [mkdirp](https://npm.io/package/mkdirp.md) ^0.5.1
- [imagemagick](https://npm.io/package/imagemagick.md) 0.1.x
## Recent versions
- 1.0.5 (latest) — 2015-07-08
- 1.0.4 — 2015-06-13
- 1.0.3 — 2015-06-05
- 1.0.2 — 2014-10-08
- 1.0.1 — 2014-10-07
- 1.0.0 — 2014-10-07
## README
Grunt App Icons
===============
Will create icons for your project.
- Favicon
- Touch Icons
- iOS Icons
- Android Icons
Installation
------------
```sh
npm install grunt-app-icons --save-dev
```
```js
grunt.loadNpmTasks('grunt-app-icons');
```
Example Configuration
---------------------
```js
appIcons: {
all: {
src: 'src/icon/app-icon.png',
dest: 'src/icon/',
options: {
createDirectories: true,
type: ['all']
}
},
www: {
src: 'src/icon/app-icon.png',
dest: 'www/',
options: {
type: ['touch', 'favicon'] // android, ios
}
}
}
```
Advanced Configuration
----------------------
Additional arguments may be passed to the `convert` command as needed as an array or function. The `%size%` placeholder is interpolated with the `wxh` dimensions of the icon being processed. For example, to apply a scalable overlay to the icons (where 120x120 is the size of the SVG):
```js
appIcons: {
mobile_beta: {
src: 'src/icon/app-icon.png',
dest: 'src/icon/',
options: {
createDirectories: true,
type: ['ios', 'android'],
args: [
'-background', 'none',
'-size', '120x120',
'src/icon/app-icon-beta-overlay.svg',
'-resize', '%size%',
'-composite'
]
}
}
}
```
Similarly, to create rounded corners on Android:
```js
appIcons: {
mobile_beta: {
src: 'src/icon/app-icon.png',
dest: 'src/icon/',
options: {
createDirectories: true,
type: ['android'],
args: function (size) {
if (size) {
var dimensions = size.split('x');
var cornerRadius = Math.round(100 * dimensions[0] * 20 / 114) / 100;
return [
// Create a 1px transparent border around the image to improve
// antialiasing
'(',
'-size', '%size%',
'xc:none',
'-draw', 'fill white rectangle 1,1 ' + (dimensions[0] - 2) + ',' + (dimensions[1] - 2),
')',
'-compose', 'CopyOpacity',
'-composite',
// Mask off the four corners
'(',
'+clone',
'-alpha', 'extract',
'-draw', 'fill black rectangle 1,1 ' + cornerRadius + ',' + cornerRadius + ' fill white circle ' + cornerRadius + ',' + cornerRadius + ' ' + cornerRadius + ',1',
'(',
'+clone', '-flip',
')', '-compose', 'Multiply', '-composite',
'(',
'+clone', '-flop',
')', '-compose', 'Multiply', '-composite',
')',
'-alpha', 'off',
'-compose', 'CopyOpacity',
'-composite'
];
}
return [];
}
}
}
}
```
Note that the favicon type does not support size interpolation and uses a significantly different convert command than the other icons that are simple resize operations.
Html
----
```html
```
License
=======
grunt-app-icons is licensed with the MIT license.
See LICENSE-MIT for more details.
---
_Source: https://npm.io/package/grunt-app-icons · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._