How to Create DSi/3DS Skins

To make a TWiLight Menu++ skin, you will need an image editor capable of exporting .png files, 16 BPP .bmp files or .png files, and 4 BPP .bmp files. Ideally, it should also be able to manually rearrange image palettes. GIMP is recommended and will be used for this guide, as it’s capable of everything needed.

Part 1: Download the examples #

The first thing you should do is download the example skins. These can be used as a base for your skin and are already in the correct format, so if you have issues later on, you can compare with these.

Part 2: Editing images #

Download and install GIMP

• Other image editors such as Photoshop may work, but GIMP is what will be used in this guide

Once installed, open GIMP and select Windows -> Dockable Dialogs -> Colormap. This opens the colormap dialog, which will be helpful when editing paletted images.

You can now open whichever image you want to edit in GIMP and continue to the section below based on which folder it’s in. Note that TWiLight Menu++ is picky about the exact format of the images and it varies by which folder they’re in, so make sure to export as the section says.

Background textures (background folder) #

These can be PNG files or 16-bit (A1 R5 G5 B5 or X1 R5 G5 B5) BMP files.

• If using BMP files, you can set them to 16-bit under Advanced Options while exporting. You may need to do this each time you export as BMP

Battery textures (battery folder) #

These must be PNG files. Transparency is supported, however only 100% transparency will work.

Paletted textures (grf folder) #

These must be 4 BPP (16 color) BMP files.

To edit these in GIMP, select Image -> Mode -> RGB to allow changing colors, then when done changing colors, select Image -> Mode -> Indexed... to convert back to paletted. When switching to indexed, ensure that Generate optimum palette is checked and Maximum number of colors is set to 16.

Note: Some images in the DSi theme have their palettes overridden based on the user’s profile color. If editing the colors of these ensure that the UserPalette option for it in the theme.ini is set to 0.

After converting to indexed, go to the colormap dialog and ensure the transparent color (#FF00FF) is color #0 in the colormap. If it isn’t, right click in the colormap and select Rearrange Colormap... then move the transparent color to be the first color in the colormap and select OK.

If there are fewer than 16 colors in your final colormap, press the + button at the bottom of the colormap dialog until you have 16 colors.

When exporting, it’s recommended to check the Do not write color space information box under the Compatibility Options dropdown.

DS Classic Menu textures (quickmenu folder) #

These must be PNG files.

UI textures (ui folder) #

These must be PNG files. Transparency is supported, however only 100% transparency will work. Any pixel that is transparent in one texture should be transparent in all of them, so that it’s properly overwritten on change.

Video texture (video folder) #

Only used for the 3DS theme, 3dsRotatingCubes.rvid is a Rocket Video file. For more information on converting videos to rvid, read Converting a video to .rvid on the Vid2RVID wiki. If you don’t want this to be drawn you can simply delete it.

Volume textures (volume folder) #

Volume textures are only displayed in DSi Mode.

These must be PNG files. Transparency is supported, however only 100% transparency will work.

Theme configuration (theme.ini file) #

You may configure various options on how the theme is drawn in the theme.ini to accommodate larger graphics or different layouts. For true/false options, 0 is false, and 1 is true. Options with a blank default value for a theme are unused in that theme.

Macro Mode options #

You may add specific override options to theme.ini for use in Macro Mode. To do this, add [MACRO] to a blank line at the bottom of the configuration file, then add any specified configurations below it.

Custom background music and sound effects #

The DSi and 3DS themes also support custom music. See DSi/3DS skins - Custom SFX for more details.

Custom fonts #

You may put Custom Fonts in the font folder for use in the skin. You can also add override fonts for the date & time using date_time.nftr, and the console username with username.nftr.

Custom palettes #

For the paletted textures (grf folder), you can optionally add override palette sets which are used when the corresponding UserPalette setting is enabled. Palette set files can be created using this editor. When using the editor, import the image you would like to work with, then create a palette for each of the 16 DS Profile colors. You can use this example palette file as a starting point.

The 16 rows of the palette collection correspond to each profile color and should be in the following order:

1. Gray-Blue
2. Brown
3. Красный
4. Розовый
5. Orange
6. Жёлтый
7. Lime Green
8. Зелёный
9. Dark Green
10. Turquoise
11. Cyan/Light Blue
12. Синий
13. Dark Blue/Indigo
14. Violet/Dark Purple
15. Фиолетовый
16. Magenta

Once you’ve created a palette file, place it in the palettes folder. The name of the palette file should match the name of its image but with a .bin extension instead (ex. start_border.bin will be applied to start_border.bmp).

You may also put a username.bin palette file to change the palettes of the username font. Make sure to set the palette editor to Font Mode when creating this file.

Part 3: Adding to TWiLight Menu++ #

Once you’ve edited some graphics and would like to test your skin, simply copy your skin folder (the folder containing the background, battery, etc folders) to sd:/_nds/TWiLightMenu/3dsmenu/themes/ or sd:/_nds/TWiLightMenu/dsimenu/themes/ for 3DS and DSi theme skins respectively.

Part 4: Sharing your skin #

Once you’ve completed your skin, you can share it with the community by creating a Pull Request adding it to the DS-Homebrew/twlmenu-extras GitHub repository in a .7z file. If you’re unfamiliar with using git you can also simply create an issue on that repository with a zip file of your skin requesting it be added.