Menu
homeiOS

Indexed colors. Convert an RGB or grayscale image to indexed color mode

Converting to indexed color mode reduces the number of colors in an image to 256 or fewer—the standard number of colors supported by GIF and PNG-8 formats, as well as many multimedia applications.

Converting to indexed color mode reduces the number of colors in an image to 256 or fewer, the standard number of colors supported by GIF and PNG-8 formats and many media applications. This conversion reduces the file size by removing color information from the image.

To convert an image to indexed color mode, it must contain 8 bits per channel and be in RGB mode or grayscale.

  1. Choose Image > Mode > Indexed Colors.

    Note. All visible layers will be flattened, and all hidden layers will be deleted.

    For gradated images gray conversion happens automatically. For RGB images, the Indexed Colors dialog box appears.

  2. In the Indexed Colors dialog box, select View to display preview changes.
  3. Set conversion options.

Conversion options for indexed color images

When converting RGB images In Indexed Color mode, you can set several conversion options (in the Indexed Color dialog box).

Palette type When converting images to indexed color mode, several types of palettes are available. For the Perceptual, Selective, and Adaptive options, you can choose to use a local palette based on the colors of the current image. Exist following types palette Accurate Creates a palette based on the exact colors used in the RGB image. This option is only available when the image has 256 colors or less. Because this palette contains all the colors present in the image, no color mixing will occur. System (Mac OS) Uses the default Mac OS 8-bit palette, which is based on uniform sampling RGB colors. System (Windows) Uses the default Windows 8-bit palette, which is based on uniform sampling of RGB colors. Web Uses 216- color palette, which web browsers (regardless of platform) use to display images on monitors limited to 256 colors. This palette is a subset of the Mac OS 8-bit palette. This setting allows you to avoid diffuse color mixing in the browser when viewing images on a monitor limited to 256 colors. Uniform Creates a palette based on an even selection of colors from the RGB color cube. For example, if you take six equally spaced color levels for red, green and blue, the result is a uniform palette of 216 colors (6 cubed = 6 x 6 x 6 = 216). The total number of colors in the image will match the nearest full cube (8, 27, 64, 125, or 216) and will be less than the value specified in the Colors field. Local (perceptual) Creates a custom palette, giving preference to colors that the human eye has an affinity for highest sensitivity. Local (selective) Creates a color table similar to the Perceptual table, but giving preference to areas big size and Web color preservation. Typically, this option produces images with the most accurate colors. Local (adaptive) Creates a palette based on a selection of spectral colors that appear most frequently in an image. For example, for an RGB image that contains only green and blue colors, the palette will consist mainly of blue and green shades. In most images, colors are concentrated in certain areas of the spectrum. For more precise palette control, first select the part of the image that contains the colors you want to highlight. Photoshop will size the transform according to these colors. Basic (perceptual) Creates a custom palette, giving preference to colors to which the human eye is more receptive. Applies if several files are open at the same time; affects everything open files. Main (selective) Creates a color table similar to the Perceptual table, but with a preference for larger areas and preserving web-compatible colors. Typically, this option produces images with the most accurate colors. Applies if several files are open at the same time; affects all open files. Basic (adaptive) Creates a palette based on a selection of spectral colors that appear most frequently in an image. For example, for an RGB image that contains only green and blue, the palette will consist primarily of blue and green. In most images, colors are concentrated in certain areas of the spectrum. For more precise palette control, first select the part of the image that contains the colors you want to highlight. Photoshop determines the size of the transform according to these colors. Applies if several files are open at the same time; affects all open files. Custom Creates a custom palette using the Color Table dialog box. Edit this chart and save it for later use, or click "Download" to download a previously created color chart. This option also displays the current Adaptive Palette, which can be useful for viewing the colors most commonly used in an image. Previous Uses the custom palette from the previous conversion, allowing you to easily convert multiple images using the same custom palette. Number of colors For the Uniform, Perceptual, Selective, and Adaptive palettes, you can specify the exact number of colors to display (up to 256) by entering a value in the Colors box. This field only specifies how the indexed color table is created. For Adobe Photoshop the image will still be 8-bit with 256 colors. Enabling colors and transparency To specify colors for the indexed color table or set transparency for an image, select the following options: Forced Contains options for forced inclusion certain colors to the color table. "Black and White" adds pure black and pure white to the color table, "Primary Colors" adds red, green, blue, cyan, magenta, yellow, black and white, "Web" adds 216 Web colors, and "Custom" » allows you to select custom colors to add to the table. Transparency Specifies whether transparent areas of the image should be preserved during conversion. Selecting this option adds a special index entry to the color table corresponding to transparent colors. If this option is not selected, transparent areas will be filled with a matte color (or white if a matte color is not selected). Substrate Defines background color, used to fill smooth edges adjacent to transparent areas of the image. When Transparency is selected, a matte color is applied to the softened edges, helping the edges blend into the web page background of the same color. If Transparency is not selected, the matte color is applied to transparent areas. If the “Transparency” option is activated, then selecting “None” will create a transparent area with a sharp border; otherwise, all transparent areas will be filled with solid white.
 Matte color options are only available when there is transparency in the image. Dithering Unless you select the Fine option, the color table may not contain all the colors that appear in the image. You can use color mixing to imitate colors that are not in the chart. Its essence is to mix pixels of available colors to simulate colors not included in the table. Select a blending option from the menu, and then enter a dither percentage. The higher this value, the more colors will be mixed, but this may increase the file size. Select from the following options: No There is no mixing of colors; instead, the color closest to the missing one is selected. This will lead to the appearance of sharp transitions between shades of colors in the image, which creates a posterization effect. Random Uses a diffusion method that produces less structured dithering than the Pattern option. To protect images contained in the color table from color mixing, select the Keep Exact Colors option. This is useful for saving in web images fine lines and text. Pattern Uses a square pattern, similar to halftone, to simulate colors not found in the color chart. Noise

Allows you to reduce joints along the edges of image fragments. Select this option if you plan to cut the image to fit it into an HTML table. The description of the image as a whole may consist of descriptions of the colors of all its elements (dots). This is the simplest and most obvious way to describe the entire image. However, here the problem arises of creating a compact description in order to save the computer memory required for storing it. Currently applied various methods creating compact descriptions. Let us focus for now on only one, called Indexed Color

In practice, images often do not contain all the colors perceived by the eye, but only a small subset of them. For example, posters are usually painted in no more than ten colors. Let's imagine some picture. Let's divide all the colors distinguishable on it into several classes. For example, similar colors can be classified as the same class, but significantly different colors can be classified as different. The totality of all such classes forms the color palette of this picture. The palette elements (color classes) can be numbered or, in other words, indexed. Next, we’ll create a table in which each index will match a color from the palette (for example, an RGB code). Then the picture description must contain this table and a sequence of indices corresponding to each point in the picture. If there are fewer palette elements than the original colors, then with this description the original color is lost. graphic information. If there are as many palette elements as there are original colors, then the description accurately conveys the original graphic information.

In practice, palettes containing 256 colors are quite widely used; each color is represented by one byte or eight bits). Sometimes 16-color (4-bit) palettes are used. A frequently used 16-bit color representation is called High Color. Its palette contains 2 16 = 65,536 colors. Essentially, these are indexed RGB colors. Indexed colors are used in GIF graphics files, a format that is extremely popular in Web design.

In Photoshop, the original image must be in RGB mode before it can be converted to an indexed color system. It should be noted that after indexing, most editing functions in Photoshop will not be available. If you still need to edit such an image, then first convert it to RGB mode (Image › Mode › RGB)(Image › Mode › RGB). After editing, you can return to indexed color mode.

Team Image › Mode › Indexed Color(Image › Mode › Indexed) opens a window in which you can set parameters for displaying an image in indexed color mode.

Drop-down list Palette(Palette) allows you to select either a ready-made palette or a method for calculating colors to create a palette based on the colors present in the image. The following options are possible.

Rice. 28. Window for setting conversion parameters to indexed colors

  • Exact(Accurate). If the source image contains less than 256 colors, then this value is set by default. This option good for high contrast and black and white images.
  • System(System). There are two options for this parameter, used for operating systems Windows and Mac OS. Typically used when creating background patterns.
  • Web. Web browsers have their own 216-color palettes. When displaying an image on a monitor configured to display 256 colors, the browser automatically converts all colors in the image to the Web palette.
  • Uniform(Universal). This palette represents an even distribution of the colors of the spectrum.
  • Adaptive(Adaptive). The most commonly used colors are selected for the palette. There are two possible options for this parameter - Local(Local) and Master(Master). Option Local allows you to take into account colors only in the current image, and Master- in several images. When using the option Local You can select a certain area in the image so that when constructing a palette, preference is given to the colors of this area. Parameter Adaptive is used more often than others.
  • Perceptual(Receptive) and Selective(Selective). Are some variations of the parameter Adaptive Perceptual Typically used for photographs where fidelity is more important than the number of colors. Selective Best suited for bright, clear images. As in the case of the parameter Adaptive, options Perceptual And Selective have two options - Local(Local) and Master(Master).
  • Custom(Order). Allows you to load a color palette from a file with the .act extension, as well as save it in a file. However, the same tool for an image with indexed colors can be called using the command lmage › Mode › Color Table(Image › Mode › Palette).
  • Previous(Previous). Selecting this switch allows you to use the last color palette created using the command Image › Mode › Indexed Color(Image › Mode › Indexed). Typically used when creating multiple high-contrast images that need to appear uniform in color. The parameter is available if you have used the command at least once in the current session Image › Mode › Indexed Color(Image › Mode › Indexed).

Field Colors(Colors) allows you to set the number (from 2 to 256) of colors in the palette. The lower this number, the smaller the file will be. If checkbox Preview(Preview) is installed, you can observe how the choice of a particular number of colors in the palette affects the image quality. Try to choose the lowest value at which you are satisfied with the image quality.

Drop-down list Forced(Unnatural) allows you to lock some colors so that they remain unchanged during indexing. You can select the following values ​​from the drop-down list:

  • Black and White(Black and white). Preserves the black and white colors in the original image.
  • Primaries(Original). Stores 8 colors: white, red, green, blue, cyan, dark red, yellow and black.
  • Web. Saves 216 colors from the Web palette.
  • Custom. Allows you to specify which colors to keep. When you select this option, a window opens Forced Colors(Forced Colors), where you can see a swatch for each blocked color. To add a new sample, click on an empty cell and select a color in the window that opens Color Picker(Flower picker). To unlock a color, click on its swatch while holding down the key CTRL.
  • None(No). None of the colors are blocked.

Checkbox Transparency(Transparency) allows you to preserve transparent areas.

Drop-down list Matte(Matte) is used to select the coloring of translucent pixels in the image. This option is used in conjunction with the option Transparency(Transparency); if the image does not contain transparent areas, then the parameter Matte not available. If checkbox Transparency installed, then list Matte allows you to specify the color of translucent pixels in an image. If checkbox Transparency cleared, then selected in the list Matte the color will fill both translucent and transparent pixels. In Web design using a list Matte choose a color that matches the background color of the Web page.


Indexed images are widely used to represent graphics on the Internet. They, as you remember, allow you to transmit up to 256 fixed colors. A set of image colors (palette) is stored in a file along with the image and is used by the browser for display.

Indexed color images are obtained from full color images by reducing the number of colors. How to convey 16 million colors of a full-color image with 256 indexed colors? There is an operation for this called dithering. Anti-aliasing is based on the same optical illusion as typographical printing: several adjacent dots of different colors, being quite small, give the impression of a dot of “total” color. The difference between the image after printing and the indexed one is only that in the first case four colors are used, and in the second - 256. Photo-shop in the Indexed Color dialog box, which appears after executing the Image/Mode/Indexed Color... command, allows you to select one of three (Fig. 9.2) anti-aliasing options (or color settings):

Pattern Each of the 16 million colors is associated with a specific combination of pixels available in the palette of the indexed image. When examined closely, this imitation looks like a pattern of colored dots.

Diffusion. With this smoothing algorithm, each pixel is recoded one by one. Once a suitable combination of indexed colors has been selected to represent the first pixel, the next one is analyzed. Instead, pixels are added, the color of which, together with the color of the previous ones, will give the required one. This operation is performed on all pixels of the image. Application this method gives a more attractive result because it does not create an obtrusively repeating pattern.

Noise. Like Diffusion, it gives a random distribution of pixels, but guarantees against the appearance of “patterns” in smooth gradient transitions and errors at the edges of the image.

None. This anti-aliasing method is essentially no anti-aliasing. In this option, for each color the closest one from the available color palette is simply selected. This inevitably leads to severe color distortion and is only used in cases where their number only slightly exceeds 256.

Rice. 9.2. Anti-aliasing methods for color indexing

1. Open the plane l.tif file.

2. Create a copy of the file using the Duplicate... menu command.

3. Select the Indexed Color... mode from the Mode list located in the Image menu.

4. You will see the Indexed Color dialog box. Here you need to select the image palette, color depth, anti-aliasing method, anti-aliasing quality and color accuracy. From the list of palettes, select the Web palette.

5. From the Dither list, select the Diffusion option. As already mentioned, the most acceptable option.

6. Set the Color Matching switch to Best and check the Preserve Exact Colors checkbox to achieve maximum quality.

7. Click OK.

8. Do steps 3-8 with the duplicate image, only in step 4 select the Adaptive palette. Compare the resulting indexed images (to see the differences, zoom in on the documents).

9. Undoubtedly, an adapted palette gives a much better result. This especially affects images with big amount shades of several colors, since the Web palette has many colors, but few shades. Make sure of this by opening the palette by the Color team Table... of the same list Mode menu Image.

10. Close both images without saving.

The use of indexed images for display is especially successful text information and drawings. In this case, 256 colors are even unnecessary - you can get by with fewer of them. Indexed formats give you this opportunity. Photoshop automatically calculates the number of colors in the indexed image and rounds it to the nearest power of two: 2, 4, 8, 16, 32, 64, 128. Fewer colors allow you to create graphic files smaller size.

And at the beginning of this lecture, GIFs and many other graphics intended for games and multimedia are saved in Indexed Color mode. These image files take up little space (almost like grayscale images), they are often highly compressed, and they are great for older 8-bit monitors that some people still use.

We previously said that the old approach of converting images to Indexed Color before saving them as GIFs is deprecated because it is more convenient to leave the image in RGB mode and use a dialog box Save For Web to transform it during the process. However, many users still need to work with images that have indexed colors in Photoshop, and the program includes two tools to help with this process: a dialog box creating compact descriptions. Let us focus for now on only one, called and dialog box Color Table. There are also several ways to obtain and work with Web-resistant ("Internet") colors, which we will look at in the next section.

You can convert an RGB or grayscale image to indexed colors using the Image > Mode > Indexed Color command. As a result, a dialog box appears creating compact descriptions. Let us focus for now on only one, called(See Fig. 18.17). Many of the options here have the same effect as in the dialog box. Save For Web(see section " GIF format" earlier in this lecture). However, there are several special means, which need to be discussed separately.


Rice. 18.17.

  • Preview. When Photoshop 5.5 was released, we were glad that Adobe finally included a checkbox Preview to the dialog box creating compact descriptions. Let us focus for now on only one, called, allowing you to see in advance what will happen to the image. There are very few cases where you need to disable this checkbox.
  • Palette. The Palette pop-up menu contains a number of various possibilities, including Perceptual, Selective and Adaptive color reduction methods in two versions - "Local" and "Master". We have reason to say that there is no point in using Photoshop Master version: This is an annoying holdover from ImageReady. If you want to use master palettes (applied to multiple images at once), then it is better to do this in ImageReady. And again we repeat that we usually use the option Perceptual for scanned photographic images and option Selective for "synthetic" images with sharp edges.

  • Transparency. Any transparent pixels in your image may also remain transparent in the final indexed color image. But if there are no transparent pixels in the image, disable the checkbox Transparency in the dialog box creating compact descriptions. Let us focus for now on only one, called, otherwise Photoshop will add a color swatch to your color table and indicate that the swatch is transparent color(taking a sample that would be better to use for some color).

    Of course, indexed color documents cannot contain partially transparent pixels, so the popup list Matte allows you to smooth these pixels with some other color (on top of which the image will later be placed). If you select from the list Matte option None, Photoshop will create a hard-edged border. This is considered a bad thing, and indeed, images without edge smoothing appear "jagged" in Photoshop, but if placed on a colored or patterned background, the jaggedness often becomes invisible (and even if it is visible, it is still better than ghosting around the image, see Fig. 18.18).

    Objects with smoothed and unsmoothed edges


    Rice. 18.18.
  • Forced. Popup list Forced allows you to force certain colors into the image's color palette. For example, if you select the default option Black and White, then Photoshop ensures that these two colors are present in the palette. This is especially important if you are using very a small amount of colors or want to be fixed in the palette specific color and don't change it. Except Black and White, to the list Forced options included Primaries(primary colors; the palette is forced to include red, green, blue, cyan, magenta, yellow, black and white), Web (which ensures that all 216 Web-resistant colors are included in the palette) and Custom (custom, which allows you to specify your own colors , which must be in the palette of the final image).

Clue. Priority colors. In some cases, your Photoshop looks The priority of colors may not match. Take, for example, a portrait on a blue background. Blue is completely unimportant for you here - it would be better if Photoshop included more flesh tones in the palette. You can force Photoshop to pick up the colors you want by selecting the area that contains them and converting the image to Indexed Colors. True, the colors may change slightly, so this method is not particularly successful for stable color rendering on the Internet.

Clue. Saving palettes. After converting the image to an indexed color, you can view the palette using the command Image > Mode > Color Table. More importantly, in this window you can save this palette to disk to use for other transformations (click on the button Save). This allows you to standardize multiple images using one palette. Additionally, custom palettes saved to disk from Photoshop can also be used in some media programs. Note that the palette must be saved with the name extension ".aco" if you want it to work on Windows and cross-platform machines.

Clue. Defining image sizes for HTML tags. If you write the HTML code yourself, then it is advisable to indicate its width and height in the source image label. For example: . If you don't specify dimensions, the Web browser will be forced to download the entire image and then place it on the page according to the layout. To see these values ​​in Photoshop, just place the cursor in the dimensions field in the lower left corner of the document and, while holding (Option), click the mouse button (see Fig. 18.19).


Rice. 18.19.

Editing colors. Each pixel in the image of indexed colors is assigned a number from 0 to 255. And the color itself is assigned by comparing the pixel number with the numbers of the color conversion table (clut). The program does all this automatically, without requiring your participation. One of the reasons for converting to Indexed Colors mode is that you can change the images by editing the clut table. Call her with the command Image > Mode > Color Table, click on any of the color swatches and edit it. At large tables, including more than 16 colors, this process is quite cumbersome, but in some cases editing the color table gives very good effect(See the tip "Replacing Indexed Colors" later in this lecture.)

Indexed color

Monochrome, halftone and full-color images are widely used in the production of original layouts intended for replication by any means. In addition to those listed, there is another type of color images, which until recently had purely historical significance. Before the widespread use of video adapters with large amounts of video memory and SVGA monitors, most computers were capable of displaying no more than 256 colors on the screen simultaneously. Older monitors limited this number to 64 or 16. The most rational way of encoding in such conditions was their indexing. During indexing, each color in the image was assigned a serial number, which was used to describe all pixels that have that color. Since the set of colors was different for different images, it was stored in the computer memory along with the image. The set of colors used in an image is called a palette (color table), and the way the color is encoded is called indexed color ( indexedcolor). With the development of computer video systems, indexed colors are no longer used as widely. Even modern ones office computers capable of displaying 65,536 on the screen (mode High Color) or 16.8 million colors (mode TrueColor).

The color depth of indexed images depends on the number of elements in its color table and can range from 2 to 8 bits. To describe 64 colors you need 6 bits, for 16 colors - 4 bits. An image consisting of 256 colors requires 1 byte (eight bits). The amount of memory occupied by the indexed image also changes accordingly. An image with a palette of 256 colors requires the same amount of memory as a grayscale image. With a smaller color table, the memory footprint will be even lower. Note that the image is in color and the file size is quite small. It was this circumstance that gave a second life to indexed images with the development of Web design, since file sizes are critical for transmission over the network. Indexed formats are now widely used in preparing images for electronic distribution.


Rice. 2.16. Dialog window IndexedColor

Indexed images are usually obtained from full-color images by reducing the number of colors. In Photoshop, the command for this is creating compact descriptions. Let us focus for now on only one, called(Indexed color) list Mode(Mode) menu Image(Image). It opens a dialog box in which you set the parameters for converting the image to an indexed color (Fig. 2.16).

First of all, this is a palette ( color chart), number of colors, additional colors and transparency. Below in the group Options(Options), sets the method for processing translucent areas and anti-aliasing parameters.

In the list of palettes Palette(Palette) There are several options to choose from. They can be divided into fixed and algorithmic. The first are strictly specific set colors. As a rule, these are the colors used by some viewer program or device (for example, the Web palette, standard for browsers, the Uniform palette for VGA monitors, Windows - the Windows system palette.

Photoshop generates algorithmic palettes individually for each image. Such palettes provide the most adequate rendering. Several alternative color reduction algorithms are proposed. These include palettes Selective(Selective), Adaptive(Adaptive) and Perceptual(Perceptual). In all cases, Photoshop automatically selects the maximum image colors into the table, but does this using different algorithms. Palette Adaptive(Adaptive) is simply a selection of the most common colors. Selective(Selective) gives preference to those colors that fill the largest areas of the image plus colors from the Web palette, a Perceptual(Perceptual) focuses on the features of perception, preserving the colors of that part of the spectrum where the eye is most sensitive to details.

Finally, the point Previous(Previous) means that the program uses the table defined for the previous file indexed in this session.

List Colors(Colors) specifies the number of colors in the indexed image, in other words, the size of the palette. This parameter only makes sense for algorithmic palettes, since in fixed palettes it is hard-coded. The fewer colors used in the image, the smaller its size, but the worse the color rendition.

In field Forced(Forced) sets of colors that are entered into the table "forcibly" are specified. It can be black and white colors, Primaries(Basic) (blue, red, green, magenta, yellow, cyan, black and white) or others. Select an option Primaries(Basic) and watch how the image changes.

Note
Images in indexed format may contain transparent areas. Transparency preservation mode is enabled by checking the box Transparency(Transparency). The way translucent areas are processed is regulated in the list Matte(Border). Since there are no transparent areas in our image, we will defer discussion of this topic until Chapter 11, on preparing graphics for the Web. It also describes methods for smoothing image colors.

The limited number of colors in the palette is only suitable for hand-drawn images. If a photograph is converted into an indexed format (Fig. 2.17a), it will look like a poster with sharp boundaries colored areas (Fig. 2.17, b). Dithering algorithms are used to simulate transitional colors. By placing pixels of darker and lighter shades of the same color side by side, you can convey the missing intermediate color. Indexed images can be smoothed in different ways, defined in the list Dither(Smoothing).

Algorithm Pattern(Pattern) represents colors that are not in the palette as a set of adjacent pixels of similar colors. The result is a peculiar pattern of pixels (Fig. 2.17, c). A conspicuous pattern does not look good in photographic images. For them it is better to use an algorithm Diffusion(Diffusion) based on "error dispersion". The idea of ​​the algorithm is that each pixel in the image is assigned a color that gives the best match to the original along with the previous pixel. As a result, the error in the transmission of pixel colors is scattered throughout the image and practically does not create a characteristic pattern (Fig. 2.17, d). However, in some cases (for example, in long gradient fills) and this algorithm does not guarantee against the occurrence of patterns. In such cases, it is better to resort to the algorithm Noise(Noise) (Fig. 2.17, d).

In field Amount(Force) introduces a smoothing force. By varying this parameter, you can change appearance indexed image from a “poster” image to an almost exact one corresponding to the original. Please note that the stronger the antialiasing, the larger size has an image file.