# postcss-color-emoji

> Emoji in full color

Latest version **4.0.0** (published 2021-09-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install postcss-color-emoji
pnpm add postcss-color-emoji
yarn add postcss-color-emoji
bun add postcss-color-emoji
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 4.0.0 |
| Published | 2021-09-06 |
| First published | 2019-02-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=12.0.0 |
| Dependencies | 0 |
| Unpacked size | 11.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 5 |
| Author | Philip Bordallo |
| Maintainers | philipbordallo |
| Keywords | emoji, color, color-emoji, system, font, family |

## Links

- npm: https://www.npmjs.com/package/postcss-color-emoji
- Repository: https://github.com/philipbordallo/postcss-color-emoji
- Homepage: https://github.com/philipbordallo/postcss-color-emoji#readme
- Issues: https://github.com/philipbordallo/postcss-color-emoji/issues
- npm.io page: https://npm.io/package/postcss-color-emoji

## Alternatives

- [postcss-color-hex-alpha](https://npm.io/package/postcss-color-hex-alpha.md) — 6.4M weekly downloads
- [randomcolor](https://npm.io/package/randomcolor.md) — 348.0K weekly downloads
- [bows](https://npm.io/package/bows.md) — 1.3K weekly downloads
- [ep_prefer_color_scheme](https://npm.io/package/ep_prefer_color_scheme.md) — 260 weekly downloads
- [coc-yank](https://npm.io/package/coc-yank.md) — 61 weekly downloads

## Recent versions

- 4.0.0 (latest) — 2021-09-06
- 3.0.0 — 2020-06-07
- 2.0.0 — 2019-07-31
- 1.1.1 — 2019-02-10
- 1.1.0 — 2019-02-10
- 1.0.1 — 2019-02-09
- 1.0.0 — 2019-02-09

## README

# PostCSS Color Emoji [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS" width="90" height="90" align="right">][postcss]
> &#x270F; Emoji in full color!

[![NPM Version][npm-img]][npm-url]
[![Build Status][ci-img]][ci-url]
[![Dependency Status][david-img]][david-url]

Depending on the font, some emojis are rendered as their text variation instead of the colored version you know and love. This [PostCSS][postcss] plugin gives you full access to the system emojis on macOS, Windows, and Linux.

```css
/* Input */
.example {
  font-family: color-emoji;
}
```


```css
/* Output */
.example {
  font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}
```

Check out the <a href="https://philipbordallo.github.io/postcss-color-emoji/">visual test</a>.

## Install

```sh
# npm
npm install --save-dev postcss postcss-color-emoji

# or yarn
yarn add --dev postcss postcss-color-emoji
```


## Usage

Add it to your PostCSS work-flow, [whatever way you choose to](https://github.com/postcss/postcss#usage).

```js
// Using a postcss.config.js
const colorEmoji = require('postcss-color-emoji');

module.exports = {
  plugins: [
    colorEmoji
  ]
};

```

Then use the `color-emoji` font-family name where ever you need it.

```css
.one {
  font-family: sans-serif, color-emoji;
}
```

```css
/* Using custom properties */
:root {
  --emoji: color-emoji;
}

.two {
  font: var(--emoji);
}
```

## Credits
- Nick Galbreath for his article on the [CSS Color emoji stack](https://www.client9.com/css-color-emoji-stack/)
- Mark Dotto for his piece on [shipping system fonts to GitHub.com](http://markdotto.com/2018/02/07/github-system-fonts/)


## [License](./LICENSE) ##


[david-img]: https://img.shields.io/david/philipbordallo/postcss-color-emoji.svg
[david-url]: https://david-dm.org/philipbordallo/postcss-color-emoji

[ci-img]: https://img.shields.io/github/workflow/status/philipbordallo/postcss-color-emoji/Continuous%20Integration
[ci-url]: https://github.com/philipbordallo/postcss-color-emoji/actions/workflows/ci.yml

[npm-img]: https://img.shields.io/npm/v/postcss-color-emoji.svg
[npm-url]: https://www.npmjs.com/package/postcss-color-emoji

[postcss]: https://github.com/postcss/postcss

---
_Source: https://npm.io/package/postcss-color-emoji · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._