Skip to main content

Insert Text and Fonts

Resprite supports two font workflows in the same text window:

  • Resprite Fonts for crisp pixel lettering and icon-style glyphs
  • Vector fonts for headings, labels, and longer multiline text

Open the text window​

Open the text window from the Edit menu. Depending on your platform or layout, the same feature may also be available from the action bar or a shortcut.

Manage fonts​

The font list on the left side of the text window is where you import, select, and organise fonts.

Import fonts​

Use the + button next to the font list to import more fonts.

  • On iOS, fonts can be imported from files or handed off directly from the Files app.
  • On desktop and Android, fonts can be imported through the file picker.
  • On desktop, you can also drag supported font files directly into the text window.
Supported import formats
  • iOS: .resfont, legacy .resprite-font, .ttf, .ttc, .otf, .otc
  • Desktop / Android: .resfont, legacy .resprite-font, .ttf
/new-medias/drawing/drawing-insert-text-ios-import-font.jpeg
Importing fonts on iOS
/new-medias/drawing/drawing-insert-text-desktop-font-actions.png
Font management actions on desktop

If you manage a larger font library, the desktop controls are faster for renaming, deleting, exporting, and opening the font folder.

/new-medias/drawing/drawing-insert-text-desktop-drag-font.gif
Dragging a font file into the text window

Organise and export fonts​

Imported fonts can be renamed or deleted to keep your library tidy. On desktop, you can also open the font folder and export the selected font. On iOS, the selected font can be shared directly.

To expand your library, browse the Resprite Fonts Collection.

Insert text with a Resprite Font​

Resprite Fonts are best for HUD text, pixel UI, icon-like glyphs, and short text that needs perfectly sharp pixel edges.

  1. Choose a Resprite Font from the list.
  2. Build the text by tapping characters in the glyph grid.
  3. Use the space, backspace, and clear controls as needed.
  4. Adjust word spacing while watching the preview.
  5. Press Insert to place the current preview into the canvas as image content. From there, you can continue positioning or transforming it like other inserted artwork.
/doc-imgs/insert-text.jpeg
Mixing multiple Resprite Fonts
tip

You can mix multiple Resprite Fonts in the same block of text, which is useful for combining body text with icons, emoji, or HUD elements.

Insert text with Resprite Fonts

Insert text with a vector font​

Vector fonts are a better fit for titles, labels, and longer multiline text.

  1. Choose a vector font from the list.
  2. Type directly into the text field. Multiline input is supported.
  3. Adjust font size, color, line spacing, and kerning.
  4. Switch to vertical layout when needed. Desktop also provides an anti-aliasing toggle.
  5. Press Insert to place the current preview into the canvas.
/versions/r49/multi_line_text_en.png
Multiline text settings

Line spacing and kerning have a big effect on rhythm and readability, especially in longer captions or stacked labels.

/versions/r49/vertical_text_en.png
Vertical text mode
Insert text with TTF fonts

Create a custom Resprite Font​

If you want to reuse your own pixel letterforms, icons, or HUD symbols, export a sprite as a Resprite Font.

  1. Draw your glyphs on the template sprite.
  2. Open the font export dialog from the export menu.
  3. Set the character grid size, word spacing, and optional monospace settings.
  4. Add creator and description fields if needed, then use Preview to check the output.
  5. Save the font. It will appear in your font list and can be used immediately in the text window.
/doc-imgs/font-template.png
Resprite Font template

Resprite Fonts do not need to be limited to letters or numbers. They also work well for icon sets, borders, emoji, and other reusable pixel elements.

/new-medias/drawing/drawing-insert-text-save-as-font-dialog.png
Current font export dialog

Continue Reading​