# svg2fontello

> This package can convert svg files to fontello icons

Latest version **1.1.0** (published 2023-11-09) · ISC license · 0 weekly downloads

## Install

```sh
npm install svg2fontello
pnpm add svg2fontello
yarn add svg2fontello
bun add svg2fontello
```

Provides the command `svg2fontello`.

## 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.1.0 |
| Published | 2023-11-09 |
| First published | 2022-05-17 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 4 |
| Unpacked size | 7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Jérémie Sellam |
| Maintainers | chloridrik |
| Keywords | svg, fontello, icon, font, ttf, otf, fonticon |

## Links

- npm: https://www.npmjs.com/package/svg2fontello
- Repository: https://github.com/jsellam/svg2fontello
- Homepage: https://github.com/jsellam/svg2fontello#readme
- Issues: https://github.com/jsellam/svg2fontello/issues
- npm.io page: https://npm.io/package/svg2fontello

## Dependencies (4)

- [rc](https://npm.io/package/rc.md) ^1.2.8
- [fs-extra](https://npm.io/package/fs-extra.md) ^11.1.1
- [xml2json](https://npm.io/package/xml2json.md) ^0.12.0
- [svgtofont](https://npm.io/package/svgtofont.md) ^4.0.0

## Alternatives

- [@fortawesome/react-fontawesome](https://npm.io/package/@fortawesome/react-fontawesome.md) — 2.2M weekly downloads
- [roboto-fontface](https://npm.io/package/roboto-fontface.md) — 196.0K weekly downloads
- [@react-native-vector-icons/common](https://npm.io/package/@react-native-vector-icons/common.md) — 150.4K weekly downloads
- [@procore/core-icons](https://npm.io/package/@procore/core-icons.md) — 4.6K weekly downloads
- [@react-md/material-icons](https://npm.io/package/@react-md/material-icons.md) — 1.6K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2023-11-09
- 1.0.31 — 2023-11-09
- 1.0.30 — 2023-11-09
- 1.0.28 — 2022-08-25
- 1.0.1 — 2022-05-17
- 1.0.0 — 2022-05-17

## README

# svg2fontello

## presentation

This package convert svg files in fontello files for web

## Installation

`npm i svg2fontello`

`yarn add svg2fontello`

Create a file `.svg2fontellorc` at the root of your project with this content :

```
{
  "svg": "./src/assets/svg",
  "outputFonts": "./src/assets/fonts",
  "importFontsPath": "../assets/fonts/",
  "outputTypes": "./src/types/IconTypes.js",
  "outputStyles": "./src/styles/fontello.css"
}
```

| Property        | description                                                           |
| --------------- | :-------------------------------------------------------------------- |
| svg             | the path to your svgs files                                           |
| outputFonts     | the path where the font files are copied (eot, svg, ttf, woff, woff2) |
| importFontsPath | the relative path to your fonts from the css file                     |
| outputTypes     | The constant definition file in javascript                            |
| outputStyles    | The css file output                                                   |

### Add Script

In your package.json add this command inside the "scripts" element :

```
    "scripts": {
        ...other scripts
        "fontello":"svg2fontello"
    }
```

Use the command line `npm run fontello` in your terminal to generate all files

## Usage

- Import the css file in your web page
- use html element `<i class="fontello-[iconName]" />` (replace iconName by the name of your icon)

The icon name is the svg file name converted in kebab-case.

### Example :

For "Toggle off.svg" file use `<i class="fontello-toggle-off" />`

### Example in ReactJS :

`<i className={IconTypes.TOGGLE_OFF} />`

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