reader font

Reader Font

Reader Font is a powerful font file reading tool designed for reading and displaying content in font files. It supports single export, download and other operations of font icons, helping users easily manage and use font icons.

Online demonstration address: https://alexpang.cn/reader-font/

Functional Features

• Font upload : Support uploading font files in .ttf and .woff formats.
• Icon Browse : Displays all icons in the font file, and supports search by name.
• Icon details : View the detailed information of the icon, including Unicode, name, SVG path, etc.
• Icon operation :
  • Change the color
  • Rotate, zoom, displacement
  • Show/Hide grid
  • Download SVG and PNG formats
  • Copy SVG code

Installation and Run

Environmental Requirements

• Node.js version >= 14
• npm version>= 6

Installation steps

1. Cloning the project to local:

   git clone https://github.com/Alessandro-Pang/reader-font.git

2. Enter the project directory:

    cd reader-font

3. Installation dependencies:

   npm install

4. Start the project:

   npm run dev

5. Open http://localhost:3000 in your browser to view the project.

Instructions for use

1. Upload fonts : Click or drag the font file to the upload area.
2. Browse icons : After the upload is successful, the interface will display all icons in the font.
3. View details : Click the icon to view details and operation options.
4. Operation icon : In the details pop-up window, you can change the icon color, rotation, zoom, displacement, etc.
5. Download and copy : Support download icons in SVG or PNG format, or copy SVG code.

screenshot

Contribution Guide

Welcome to contribute to this project! Please follow these steps:

1. Fork this warehouse.
2. Create your feature branch ( git checkout -b feature/YourFeature ).
3. Submit your changes ( git commit -m 'Add some feature' ).
4. Push to branch ( git push origin feature/YourFeature ).
5. Submit a Pull Request.

license

This project is open source based on the MIT license, please refer to the LICENSE file for details.