Zatnik images are stored in a plain-text format called an image code. This page attempts to describe the structure of an image code.
Several sections of this page begin with an example image code. Within each of those sections, you can hover over the green underlined text to highlight relevant parts of the image code. You can also click the example to select it. (It's maybe not the best system (especially since it uses JavaScript that may not work on outdated browsers >.> ), but hopefully it'll provide some help, and if it doesn't, you can probably still figure everything out.)
Feedback on parts of this page that are unclear or difficult to understand is welcome, either through a GitHub issue or perhaps through this thread on the Scratch forums.
A basic image consists of three mandatory unnamed sections. Each one is preceded by a forward slash, though this is optional on an unnamed section at the beginning of the image code (and is omitted in this example). The unnamed sections are dimensions, color definitions, and pixels, and must appear in that order.
The first unnamed section, dimensions, consists simply of the image's width and height, separated by an asterisk. This example image is six pixels wide and five pixels tall.
The second unnamed section, color definitions, lists the colors that are present in the image and assigns each one an ID. The section begins with a single digit, which determines how many characters long each color ID will be. In this example, each color ID is one character long.
The rest of the section is a list of IDs and the colors associated with them. Each item in this list consists of an ID of the length specified at the beginning of the section, followed by a six-character hexadecimal RGB color. An ID can contain any character that's within image code restrictions and is not a forward slash. The first definition in this example assigns the color ffc2c2 to the ID 0. The ID and color in a definition may optionally be separated by an equals sign, so the first definition in this example could also be written as 0=ffc2c2.
The third and final unnamed section, pixels, is a list of the pixels in the image, going left-to-right, top-to-bottom. Each pixel is represented by one of the color IDs defined in the second unnamed section. In this example, the topmost row of pixels, i.e. the first six IDs in the pixels section, has pixels with the colors ffc2c2, ffffff, 599100, ffc2c2, ffffff, and ffffff.
An image code may also contain one or more optional named sections, which can be located anywhere in the image code (except inside other sections). Each named section is preceded by two forward slashes rather than one, which must be present regardless of where in the image code the section is. The section begins with four characters that determine the section's type. Like color IDs, those four characters—as well as the rest of the section—can include any character, other than forward slash, that is within image code restrictions. In this example, the named section is of the alph type, meaning that it specifies alpha values for the image's colors. The rest of the section is type-specific content, interpreted based on the section's type. Sections with types that serve an unknown or unneeded purpose can be ignored by a reader.
The alph section determines the alpha, i.e. transparency, values associated with each color ID in the image. Continuing with the above example, the section's content is a list of two-character hexadecimal alpha values. These values correspond to the color definitions in the second unnamed section, such that the first alpha value corresponds to the first color definition, the second alpha value to the second color definition, etc. Pixels with a given color ID take on the alpha value corresponding to that ID. In the above example, the ID 1 corresponds the hexadecimal alpha value 33, meaning that pixels with the color ID 1 will have 20% opacity.
Any number of alpha values may be omitted from the end of the section. Any such values will be assumed to be ff. In the above example, the ID 4 has no corresponding value in the alpha section, so pixels with the color ID 4 will be fully opaque.
Currently there are no other officially-described named section types.
Some types of sections, such as the comm section shown above, may contain arbitrary text. Since image codes are somewhat limited in what characters they can contain and distinguish, not all text characters can be represented literally. Characters are represented as follows:
The text represented by the comment in this example is:
This image is just a demonstration of text. ☺
(Changes that don't affect meaning are omitted)