Skip to main content

​
Theme System Overview

ImageGlass supports custom theme packs that control the visual appearance including colors, icons, and UI elements. Each theme is defined by an igtheme.json configuration file and associated assets.

​
Theme Locations

Themes can be installed in two locations: 
%APPDATA%\ImageGlass\Themes\[ThemeName]\
├── igtheme.json
├── *.svg (toolbar icons)
├── Logo.svg
└── preview.webp
User themes take precedence over built-in themes with the same name.

​
Built-in Themes

ImageGlass includes these default themes:

Kobe (Dark)

Modern dark theme with accent color integrationBest for: Low-light environments, photo editing

Kobe-Light

Clean light theme with subtle colorsBest for: Bright environments, document viewing

​
Installing Themes

1

Download Theme Pack

Obtain a .igtheme file or theme folder from:
2

Install via Settings

Option 1: Using ImageGlass Settings
  1. Open ImageGlass Settings → Appearance tab
  2. Click Install theme packs
  3. Select the .igtheme file or folder
  4. Confirm installation
3

Install Manually

Option 2: Manual Installation
  1. Extract theme folder to %APPDATA%\ImageGlass\Themes\
  2. Ensure folder contains igtheme.json
  3. Restart ImageGlass
  4. Select theme in Settings → Appearance
4

Apply Theme

  1. Open Settings → Appearance
  2. Select theme for Dark mode and/or Light mode
  3. Click Apply

​
Theme Structure

​
igtheme.json Configuration

Every theme pack requires an igtheme.json file:
igtheme.json
{
  "_Metadata": {
    "Description": "ImageGlass theme configuration file",
    "Version": "9.0"
  },
  "Info": {
    "Name": "My Custom Theme",
    "Author": "Your Name",
    "Email": "[email protected]",
    "Website": "https://yoursite.com",
    "Description": "A custom theme for ImageGlass",
    "Version": "1.0"
  },
  "Settings": {
    "IsDarkMode": true,
    "NavButtonLeft": "ViewPreviousImage.svg",
    "NavButtonRight": "ViewNextImage.svg",
    "PreviewImage": "preview.webp",
    "AppLogo": "Logo.svg"
  },
  "Colors": {
    "BgColor": "#1e1e1e",
    "TextColor": "#ffffff",
    "ToolbarBgColor": "#2d2d30",
    "MenuBgHoverColor": "accent:50"
  },
  "ToolbarIcons": {
    "OpenFile": "OpenFile.svg",
    "Save": "Save.svg"
    // ... more icons
  }
}

​
Theme Info Section

​
Info.Name
string
required
Display name of the theme
​
Info.Author
string
Theme creator’s name
​
Info.Email
string
Contact email for theme support
​
Info.Website
string
Theme or author website
​
Info.Description
string
Brief description of the theme
​
Info.Version
string
required
Theme version number

​
Theme Settings

​
Settings.IsDarkMode
boolean
required
Whether this is a dark or light themeDetermines default text and UI colors.
​
Settings.NavButtonLeft
string
Filename of left navigation button image (SVG recommended)Example: "ViewPreviousImage.svg"
​
Settings.NavButtonRight
string
Filename of right navigation button imageExample: "ViewNextImage.svg"
​
Settings.PreviewImage
string
Preview image shown in theme selectorRecommended: 800x600 WebP or PNG
Application logo image (shown in about dialog)Recommended: 256x256 SVG or PNG

​
Theme Colors

ImageGlass supports extensive color customization:

​
Main Colors

​
Colors.BgColor
string
Main background colorFormat: Hex color with optional alpha (#RRGGBB or #RRGGBBAA)Example: "#1e1e1e00" (transparent), "#ffffff" (white)
​
Colors.TextColor
string
Primary text color

​
Toolbar Colors

​
Colors.ToolbarBgColor
string
Toolbar background color
​
Colors.ToolbarTextColor
string
Toolbar text and icon color
​
Colors.ToolbarItemHoverColor
string
Toolbar button hover highlightExample: "accent:140" (system accent with alpha 140)
​
Colors.ToolbarItemActiveColor
string
Toolbar button pressed state
​
Colors.ToolbarItemSelectedColor
string
Toolbar button selected/active state
​
Colors.GalleryBgColor
string
Gallery panel background
​
Colors.GalleryTextColor
string
Gallery text color
​
Colors.GalleryItemHoverColor
string
Gallery thumbnail hover state
​
Colors.GalleryItemActiveColor
string
Gallery thumbnail click state
​
Colors.GalleryItemSelectedColor
string
Gallery selected thumbnail
​
Colors.MenuBgColor
string
Menu background color
​
Colors.MenuBgHoverColor
string
Menu item hover background
​
Colors.MenuTextColor
string
Menu item text color
​
Colors.MenuTextHoverColor
string
Menu item text on hover
​
Colors.NavigationButtonColor
string
Navigation arrow button overlay color

​
System Accent Color

Use Windows system accent color in your theme: 
"Colors": {
  "ToolbarItemHoverColor": "accent:140",
  "MenuBgHoverColor": "accent:50"
}
Format: accent:[alpha] where alpha is 0-255
System accent color automatically adjusts when users change their Windows theme

​
Toolbar Icons

Define toolbar icon filenames in the ToolbarIcons section:
​
ToolbarIcons.{IconName}
string
Filename of toolbar icon (relative to theme folder)Supported formats: SVG (recommended), PNG, WebPAvailable icons:
  • ActualSize, AutoZoom, Checkerboard
  • ColorPicker, Crop, Delete
  • Edit, FlipHorz, FlipVert
  • FullScreen, Gallery, GoToImage
  • LockZoom, MainMenu, OpenFile
  • Print, Refresh, RotateLeft, RotateRight
  • Save, ScaleToFill, ScaleToFit
  • ScaleToHeight, ScaleToWidth
  • Slideshow, ViewFirstImage, ViewLastImage
  • ViewNextImage, ViewPreviousImage
  • WindowFit, ZoomIn, ZoomOut
  • Play, Pause, Export, Exit
SVG is recommended for icons - they scale perfectly at any DPI and size

​
Creating a Custom Theme

1

Create Theme Folder

Create a new folder in %APPDATA%\ImageGlass\Themes\MyTheme\
2

Create igtheme.json

Copy and modify the example configuration above
3

Add Icons (Optional)

Create or add SVG icons for toolbar buttons. Icon size is automatically scaled.Recommended: 24x24px base size, scalable SVG
4

Add Preview Image

Create preview.webp showing your theme (800x600 recommended)
5

Test Theme

  1. Restart ImageGlass
  2. Open Settings → Appearance
  3. Select your theme
  4. Verify all colors and icons appear correctly

​
Theme Compatibility

​
_Metadata.Version
string
required
Theme API versionCurrent version: "9.0"ImageGlass checks this for compatibility.
Themes with older API versions may not work correctly with newer ImageGlass versions.

​
Uninstalling Themes

  1. Open ImageGlass Settings → Appearance
  2. Click Uninstall a theme pack
  3. Select theme to remove
  4. Confirm deletion
If you delete the currently active theme, ImageGlass will fall back to the default Kobe theme

​
Sharing Your Theme

To share your custom theme:
  1. Package the theme folder with all assets
  2. Create a ZIP file or .igtheme package
  3. Include README with installation instructions
  4. Share on:

​
Troubleshooting

  • Ensure igtheme.json exists in theme folder
  • Check JSON syntax is valid
  • Verify Info.Name and _Metadata.Version are present
  • Restart ImageGlass
  • Check icon filenames match ToolbarIcons section exactly
  • Ensure icon files are in theme folder
  • Verify SVG files are valid
  • Try PNG format as fallback
  • Validate hex color format (#RRGGBB or #RRGGBBAA)
  • Check for typos in color property names
  • Ensure colors contrast properly (dark vs light mode)
  • Verify Settings.IsDarkMode matches your color scheme
  • Check all required color properties are defined
  • Compare with built-in theme structure

​
Example: Minimal Dark Theme

igtheme.json
{
  "_Metadata": {
    "Description": "ImageGlass theme configuration file",
    "Version": "9.0"
  },
  "Info": {
    "Name": "Minimal Dark",
    "Author": "Your Name",
    "Version": "1.0"
  },
  "Settings": {
    "IsDarkMode": true
  },
  "Colors": {
    "BgColor": "#0d0d0d",
    "TextColor": "#e0e0e0",
    "ToolbarBgColor": "#1a1a1a",
    "ToolbarTextColor": "#e0e0e0",
    "ToolbarItemHoverColor": "accent:100",
    "GalleryBgColor": "#1a1a1a",
    "GalleryTextColor": "#e0e0e0",
    "MenuBgColor": "#1a1a1a",
    "MenuTextColor": "#e0e0e0"
  },
  "ToolbarIcons": {}
}
This minimal theme uses default icons and system accent colors.

​
See Also

Appearance Settings

Configure theme selection and visual options

Advanced Configs

Advanced customization options

Build docs developers (and LLMs) love

Get started for freeTalk to us