Building a home-made Icon Font in React Native

The problematic 😞

The solution: Icon Font 👍

import React from 'react’;
import customFontGlyph from '../../assets/font/custom-font-icon.json’;
import { createIconSet } from 'react-native-vector-icons’;
const Icon = createIconSet(customFontGlyph, 'custom-font-icon’, 'custom-font-icon.ttf’);const App = () => <Icon name=”icon-name” />;

Building a custom font - 3rd party services

Uploading an icon into Fontello

Building a custom font — in house 🏠

$ expo init
$ yarn add icon-font-generator react-native-vector-icons
Landmark and Monuments Collection
Create icon.js file
$ node create-icon
Icon components generated

Last words 👋

Software Engineer during the day, cook at night 👨‍🍳 Traveller and Foodie 🧳 Whenever I can I like to write and speak 🤓 Berlin 📍