Text Style Studio

Preview Text

Insert PICO-8 Glyph

Preview Background

Styles

Underline Hollow Pinball
Wide Tall Stripey

Spacing

Width (x)

Height (y)

Colors

Foreground
Background
Outline

Outline Options

Custom Color Palette

Color Palette Studio
Apply a Custom Palette
Reset to Default

Current Palette: Default

Export Style Settings

Generated Code

text_style = ""
string = "i ♥ pico-8"
print(text_style .. string)

Copy Style

Test in PICO-8 Education Edition

Save / Share
Text Style

398

Select Color

Insert PICO-8 Glyph

Custom Palette

Paste a Color Palette Studio share link or code:

Apply

Preview Text

Text Input Field

You may use this field to alter the text displayed in the PICO-8 font preview to test specific words, numbers, or symbols with the different styles applied.

Letter Case

PICO-8's default font makes lowercase letters appear uppercase, while true uppercase is made smaller and called "puny-font" which you can turn on in PICO-8 with Ctrl+P.

Insert Glyphs

PICO-8 offers 26 unique icons as text characters (P8SCII) that you can print in your game or even use in your code. We provided you with an easy way to select and insert these glyphs into the preview area. You can get creative with applying text styles to these to produce an even wider variety of symbols.

Click the text input field where you want to add a glyph, then click the "Insert PICO-8 Glyph" button to choose which glyph to add to the preview text.

Preview Background

This option does not effect the Text Style output.

Choose the color for the preview window background. You may want to change this to better display the text color choices of foreground, background, and outline. Or you may want to set the preview background to the color that is the main backdrop of your game to visualize it better.

Text Style Options

Underline

code: \^u

Draw an extra line under each character at the place of text height setting (see "Spacing" options). It uses the foreground color.

Warning: when enabling both Underline and Wide settings, the preview does not match the actual PICO-8 output, where the underline will appear as dashed lines.

Hollow

code: \^o!

Draw only the outline around characters, using the foreground color, and leave the actual characters empty. This will disable the Outline Color option, but you may still adjust the Outline Options to control how much of the hollow outline is visible.

Wide

code: \^w

Double the width of each character printed. The default is 4 pixels wide for most characters, so enabling Wide will make them 8 pixels.

Tall

code: \^t

Double the height of each character printed. The default is 6 pixels tall for most characters, so enabling Tall will make them 12 pixels.

Stripey

code: \^=

(only available if Wide and/or Tall enabled)

This setting adds stripes through each character, horizontal when paired with Tall, vertical when paired with Wide. When Wide and Tall are both enabled, it creates horizontal stripes.

Pinball

code: \^p

This setting enables Wide and Tall text and adds the effect of stripes both vertically and horizontally, creating a dot matrix pattern. In the code output, Pinball replaces Wide, Tall, and Stripey codes with its own \^p code.

Warning: Turning on Pinball will turn off Stripey, and vice versa. Also, turning on Pinball will auto-enable Wide and Tall buttons, so turning either of those off will turn off Pinball mode as well.

Character Spacing

Width

code: \^x

Increase or decrease the width of each character printed. The default is 4 pixels wide for most characters. The minimum is 0 and maximum 15.

This does not change the characters themselves, only the space that each character occupies.

Height

code: \^y

Increase or decrease the height of each character printed. The default is 6 pixels tall. The minimum is 0 and maximum 15.

This does not change the characters themselves, only the space that each character occupies.

Warning: We have done our best to provide an accurate preview, but when altering the character spacing while also enabling styles such as underline and outline, there may be some minor differences to how PICO-8 actually prints.

Color Options

Foreground Color

code: \^f

Choose the color of the text. This will also apply to the underline and the hollow outline if that is enabled.

Background Color

code: \^#

Choose the color of the background to enable a colored rectangle behind your text or leave it disabled. The background rectangle will extend the full height and length of the text string, which includes the Spacing settings.

Outline Color

code: \^o

Choose the color of the outline to enable it, or leave it disabled. Once enabled, the Outline Options may be adjusted to set the direction of the outline around your text.

Outline Color is disabled when the Hollow setting is enabled because Hollow will use the Foreground color. However, the Outline Options are still available for the Hollow settings.

Outline Options

Arrow Buttons

code: (00-ff) after outline code

Click on any of the 8 direction arrows to enable or disable the outline drawn in that direction around each pixel of your text. The code uses a two-digit hexadecimal number at the end of the outline code.

Center "A" Button

Click on the center button surrounded by arrows to fully enable or fully disable all arrow buttons.

Warning: If you have the outline enabled but don't see it in the preview, all arrows may be turned off, or the outline color is the same as the background color or preview background.

Using Custom Colors

Button 1: Color Palette Studio

To easily select and arrange your custom color palette to be used in this Text Style Studio, start in our Color Palette Studio first. At the bottom of that page in the "Export" section, you should see a simple "Text Style Studio" link that will pass your custom palette to this page. Alternatively, you can save your palette URL by clicking the "Share Your Palette" button, and use that same URL code "?c=..." on this page.

Button 2: Apply a Custom Palette

Click this button to open a popup for pasting the color palette code that you may have saved from our Color Palette Studio.

Button 3: Reset to Default

Click this button to remove any custom palette set and use the Default PICO-8 Palette.

Export Text Style

Code Output

We have generated 3 simple lines of code that you can highlight and copy into PICO-8 for printing the preview text in the style you've selected on this page. It is just an example of how you can save the text styling and string as separate variables and print that style variable before the actual string.

Copy Style Button

This will copy only the text_style = "..." line of code to your clipboard for easy pasting into your PICO-8 game. It is likely you will want to save this styling as a variable and possibly have multiple styling variables that you can add before certain strings in your game so be sure to change the name of the variable "text_style" to one(s) of your choice.

Test in PICO-8 Edu Edition

Click this button to quickly bring the preview code over to the free PICO-8 browser version and run it to compare our preview example with the actual output in PICO-8.

We have done our best to generate an accurate preview of the text, but there are some minor differences. Let us know of any major differences you find via Discord or Email (theNerdyTeachers@gmail.com).

Save / Share

Click this button to copy the link to this page with these exact Text Style Settings encoded into the URL. You can easily save this link for yourself or sent it to others.