Giter Club home page Giter Club logo

fluent-webmoji's Introduction

Fluent Webmoji

This is basically Fluent Emoji from Microsoft.

The folder and file structure has been processed to easily request the URL of a specific emoji using their unicode value.

Additionally, every emoji has been rendered in WEBP.

The formats available:

  • WEBP: 32x32, 64x64, 128x128
  • SVG: source, and minified.

Featuring both Fluent Emoji families: 3D (Color) and Flat.

Processing

Everything has been processed in the assets folder. To replicate the results or update it:

  1. Fetch the icons from Microsoft's Fluent Emoji repo (~130mb).
git clone https://github.com/microsoft/fluentui-emoji.git
  1. Make sure you have:
  • having Python 3 (latest version)
  • Imagemagick in the system
  • inkscape. Imagemagick uses it as the backend for SVG processing. Otherwise, it will fallback to a less capable SVG processor, which fails at rendering the SVGs.
  • and node with NPM to install svgo.

Install svgo:

npm -g install svgo

or use Yarn:

yarn global add svgo
  1. Then:
python convert.py
./svg-processing.sh

convert.py will transform the folder and file structure from Microsoft's Fluent Emoji repo to the one we need.

svg-processing.sh minifies the SVGs and renders WEBP alternatives. It may take a long, long time. Like, 1 hour or so. It doesn't use all the cores because of performance loss due to overhead. You could find the optimal number of jobs for your CPU via the parallel -j3 line, where 3 is the number of jobs. Compare the differents ETA times shown by the script when running at different number of jobs. This probably can be automated but I don't want to :).

fluent-webmoji's People

Contributors

arecsu avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.