A web tool for generating spritesheets of fonts for use in games and applications.
SpriteFont Generator is a tool that lets you create font spritesheets quickly and easily. Load a TTF or OTF font and generate a PNG image containing all the characters you need, with customizable size, spacing and color settings.
- Upload TTF and OTF fonts
- Character customization
- Font size adjustment
- Individual padding control (top, right, bottom, left)
- Option to maintain padding ratio
- Customizable text colors
- Transparent background support
- Visual aid grid with adjustable color and opacity
- Zoom controls
- Real-time preview
- PNG export
- Access the tool
- Upload a TTF or OTF font
- Adjust the desired settings:
- Font size
- Padding
- Width and Height preview
- Colors
- Grid (optional)
- View the result in real time
- Download the generated spritesheet
- HTML5
- CSS3
- JavaScript (Vanilla)
- Canvas API (for rendering)
- JSZip (for ZIP export)
- Local Font Access API (for accessing system fonts)
- Clone the repository:
git clone https://github.com/italogermando/spritetype.git- Navigate to the project folder:
cd spritetype- Open the
index.htmlfile in your browser or use a local server
/
├── index.html
├── css/
│ └── style.css
├── js/
│ └── script.js
└── README.md
🤝 Contribution
Contributions are welcome! To contribute:
Fork the project Create a branch for your feature Commit your changes Push to the branch Open a Pull Request
- Godot support [In Testing]
- Construct2/3 support [In Testing]
- Real-time character preview
- Support for more engines/frameworks
- Advanced kerning options
- Light/dark themes
- Recent font history
- Multiple font support
- Advanced layout options
- Emoji support
- Multilingual interface
For questions, suggestions or problems, open an issue on GitHub.
Made with ♥ and JavaScript