Custom GUI System

Glamour includes a powerful GUI configuration system that allows you to create and customize inventory-based menus without writing any code. Define layouts, buttons, actions, and styling all through JSON files.

Overview

The Glamour GUI system provides:

Layout-Based Design - Define GUI layouts using ASCII-art grid patterns
Widget System - Buttons, labels, spacers, toggles, lists, and grids
Action System - Open pages, execute commands, toggle settings, and more
Full Styling Control - Colors, gradients, animations, and sounds
Hot Reloading - Changes apply instantly with /glamour reload

GUI Configuration Location

GUI configurations are stored in:

config/glamour/gui/
├── main_gui.json           # Main particle selection menu
├── category_gui.json       # Category browser
├── management_gui.json     # Effect management
├── search_gui.json         # Search interface
└── custom_gui.json         # Your custom GUIs

Basic GUI Structure

Every GUI configuration file follows this structure:

{
  "type": "MAIN",
  "layout": {
    "rows": [
      "XXXXXXXXX",
      "XPPPPPPPX",
      "XPPPPPPPX",
      "X<BMMMC>X"
    ],
    "size": "LARGE",
    "slotMappings": {
      "P": "PARTICLE",
      "B": "PAGE_INFO",
      "M": "MANAGE_EFFECTS",
      "C": "CLOSE",
      "<": "PREVIOUS_PAGE",
      ">": "NEXT_PAGE",
      "X": "BACKGROUND"
    }
  },
  "items": {
    "backgroundItem": "minecraft:gray_stained_glass_pane",
    "closeButton": "minecraft:barrier",
    "previousPageButton": "minecraft:spectral_arrow",
    "nextPageButton": "minecraft:spectral_arrow"
  },
  "styling": {
    "title": "<gradient:#FFD700:#FFA500>✨ My Custom GUI ✨</gradient>",
    "primaryColor": "#FFD700",
    "soundEffects": true
  }
}

Layout System

Row Definition

Layouts use ASCII-art patterns where each character represents a slot type:

{
  "layout": {
    "rows": [
      "XXXXXXXXX",  // Row 0: All background/border
      "XPPPPPPPX",  // Row 1: Particle slots with border
      "XPPPPPPPX",  // Row 2: More particle slots
      "XPPPPPPPX",  // Row 3: More particle slots
      "X<BMMMC>X"   // Row 4: Navigation and controls
    ]
  }
}

Tips:

Each row must have exactly 9 characters (9 slots)
Use consistent characters for same slot types
Order rows from top (0) to bottom

Slot Mappings

Map characters to functional slot types:

{
  "slotMappings": {
    "X": "BACKGROUND",        // Border/spacer slots
    "P": "PARTICLE",          // Content slots (particles, items, etc.)
    "B": "PAGE_INFO",         // Page number display
    "M": "MANAGE_EFFECTS",    // Management button
    "C": "CLOSE",             // Close button
    "<": "PREVIOUS_PAGE",     // Previous page button
    ">": "NEXT_PAGE",         // Next page button
    "T": "TAB",               // Tab buttons
    "S": "SORT_AND_FILTER",   // Sort/filter controls
    "F": "FILTER",            // Filter toggles
    " ": "BACKGROUND"         // Empty space (also background)
  }
}

GUI Sizes

Available GUI sizes:

Size	Rows	Slots	Use Case
`TINY`	1	9	Simple selection menus
`SMALL`	2	18	Compact interfaces
`MEDIUM`	3	27	Standard dialogs
`LARGE`	4	36	Content browsers
`HUGE`	5	45	Large inventories
`MASSIVE`	6	54	Full-screen GUIs

Item Configuration

Background and Border Items

Define visual elements:

{
  "items": {
    "backgroundItem": "minecraft:gray_stained_glass_pane",
    "disabledButton": "minecraft:light_gray_stained_glass_pane"
  }
}

Button Items

Configure action buttons:

{
  "items": {
    "closeButton": "minecraft:barrier",
    "backButton": "minecraft:oak_door",
    "confirmButton": "minecraft:emerald_block",
    "cancelButton": "minecraft:redstone_block",
    "previousPageButton": "minecraft:spectral_arrow",
    "nextPageButton": "minecraft:spectral_arrow",
    "pageInfoButton": "minecraft:written_book",
    "sortButton": "minecraft:hopper",
    "searchButton": "minecraft:spyglass",
    "removeButton": "minecraft:lava_bucket"
  }
}

Tab Icons

Define icons for tabbed interfaces:

{
  "items": {
    "tabs": {
      "ALL": "minecraft:chest",
      "SENDOUT": "minecraft:firework_rocket",
      "AMBIENT": "minecraft:glowstone_dust",
      "CATEGORIES": "minecraft:bookshelf",
      "FAVORITES": "minecraft:nether_star",
      "SEARCH": "minecraft:spyglass"
    }
  }
}

Custom Item Overrides

Override specific particle/item displays:

{
  "items": {
    "particleItemOverrides": {
      "cobblemon:shiny_sparkles": "minecraft:nether_star",
      "cobblemon:fire_ring": "minecraft:blaze_powder"
    }
  }
}

Styling System

Title and Colors

Configure visual appearance:

{
  "styling": {
    "title": "<gradient:#FFD700:#FFA500>✨ Particle Effects ✨</gradient>",
    "primaryColor": "#FFD700",
    "secondaryColor": "#FFA500",
    "accentColor": "#00FF7F",
    "warningColor": "#FF4500",
    "errorColor": "#DC143C",
    "infoColor": "#87CEEB",
    "successColor": "#32CD32"
  }
}

Color Usage:

primaryColor - Main UI elements, headers
secondaryColor - Subheaders, highlights
accentColor - Active buttons, selections
warningColor - Warnings, caution messages
errorColor - Errors, destructive actions
infoColor - Information messages
successColor - Confirmations, success states

Title Formatting

Titles support full MiniMessage formatting:

{
  "styling": {
    "title": "<gradient:#FFD700:#FFA500>✨ Particle Effects ✨</gradient>"
  }
}

Examples:

// Gradient with emoji
"title": "<gradient:#00FF00:#0000FF>🎨 Custom Menu 🎨</gradient>"

// Rainbow effect
"title": "<rainbow>Particle Selection</rainbow>"

// Bold with color
"title": "<gold><bold>Premium Effects</bold></gold>"

// Multiple colors
"title": "<yellow>Glamour</yellow> <gray>|</gray> <aqua>Particles</aqua>"

Visual Effects

Configure animations and effects:

{
  "styling": {
    "backgroundOpacity": 0.8,
    "animationSpeed": "MEDIUM",
    "soundEffects": true
  }
}

Animation Speeds:

SLOW - Gentle, smooth transitions
MEDIUM - Standard speed
FAST - Quick, snappy animations
INSTANT - No animation

Complete Examples

Example 1: Simple Confirmation Dialog

File: config/glamour/gui/confirm_dialog.json

{
  "type": "CONFIRM",
  "layout": {
    "rows": [
      "XXXXXXXXX",
      "XIIIIIITX",
      "XCXXXXDXX"
    ],
    "size": "MEDIUM",
    "slotMappings": {
      "X": "BACKGROUND",
      "I": "INFO",
      "T": "TITLE",
      "C": "CANCEL",
      "D": "CONFIRM"
    }
  },
  "items": {
    "backgroundItem": "minecraft:gray_stained_glass_pane",
    "confirmButton": "minecraft:emerald_block",
    "cancelButton": "minecraft:redstone_block"
  },
  "styling": {
    "title": "<yellow>⚠ Confirm Action</yellow>",
    "primaryColor": "#FFD700",
    "warningColor": "#FF4500",
    "soundEffects": true
  }
}

Example 2: Tab-Based Browser

File: config/glamour/gui/tabbed_browser.json

{
  "type": "BROWSER",
  "layout": {
    "rows": [
      "TTTTTTTTX",
      "XIIIIIIIX",
      "XIIIIIIIX",
      "XIIIIIIIX",
      "X<BXXXC>X"
    ],
    "size": "HUGE",
    "slotMappings": {
      "T": "TAB",
      "I": "CONTENT",
      "B": "PAGE_INFO",
      "<": "PREVIOUS_PAGE",
      ">": "NEXT_PAGE",
      "C": "CLOSE",
      "X": "BACKGROUND"
    }
  },
  "items": {
    "backgroundItem": "minecraft:black_stained_glass_pane",
    "tabs": {
      "CATEGORY_1": "minecraft:diamond",
      "CATEGORY_2": "minecraft:emerald",
      "CATEGORY_3": "minecraft:gold_ingot"
    },
    "closeButton": "minecraft:barrier",
    "previousPageButton": "minecraft:arrow",
    "nextPageButton": "minecraft:arrow",
    "pageInfoButton": "minecraft:book"
  },
  "styling": {
    "title": "<gradient:#00FFFF:#0080FF>Content Browser</gradient>",
    "primaryColor": "#00FFFF",
    "secondaryColor": "#0080FF",
    "animationSpeed": "FAST",
    "soundEffects": true
  }
}

Example 3: Filter Interface

File: config/glamour/gui/filter_menu.json

{
  "type": "FILTER",
  "layout": {
    "rows": [
      "XXXXXXXXX",
      "XFFFFFFFX",
      "XFFFFFFFX",
      "XRXXXACXX"
    ],
    "size": "LARGE",
    "slotMappings": {
      "F": "FILTER",
      "R": "RESET",
      "A": "APPLY",
      "C": "CANCEL",
      "X": "BACKGROUND"
    }
  },
  "items": {
    "backgroundItem": "minecraft:gray_stained_glass_pane",
    "filterButtonEnabled": "minecraft:lime_concrete",
    "filterButtonDisabled": "minecraft:red_concrete",
    "confirmButton": "minecraft:emerald",
    "cancelButton": "minecraft:barrier"
  },
  "styling": {
    "title": "<aqua>⚙ Filter Options</aqua>",
    "primaryColor": "#00FFFF",
    "accentColor": "#00FF00",
    "soundEffects": true
  }
}

Best Practices

Layout Design

✅ DO:

Use consistent border patterns (X for background)
Group related buttons together
Leave navigation at bottom row
Use intuitive character mappings

❌ DON’T:

Mix different border characters randomly
Place navigation buttons scattered around
Use all 54 slots for content (leave space for controls)

Item Selection

✅ DO:

Use recognizable vanilla items for buttons
Choose items that match their function (barrier for close, arrow for navigation)
Keep color schemes consistent
Test item visibility against backgrounds

❌ DON’T:

Use overly similar items for different functions
Choose items that blend into backgrounds
Use complex items for simple spacers

Styling

✅ DO:

Use gradients sparingly for impact
Match colors to your server theme
Test readability with different Minecraft settings
Enable sound effects for better UX

❌ DON’T:

Use too many colors (stick to 3-4)
Create overly bright/flashy titles
Rely only on color to convey information

Reloading GUIs

After making changes, reload GUIs without restarting:

/glamour reload gui

Or reload all Glamour configs:

/glamour reload

Troubleshooting

GUI Not Loading

Check:

JSON syntax is valid (use a JSON validator)
File is in correct location (config/glamour/gui/)
All required fields are present
Slot mappings match layout characters

Items Not Displaying

Check:

Item IDs are valid (use /give to test)
Resource pack is loaded (for custom items)
Item overrides are spelled correctly
Background items aren’t blocking content

Layout Issues

Check:

Each row has exactly 9 characters
Number of rows matches size setting
All layout characters are mapped in slotMappings
Special characters are escaped properly in JSON

Particle System - Configure particle effects
Wardrobe System - Customize particle presets
Commands - GUI command reference

Custom GUI System

Custom GUI System

Overview

GUI Configuration Location

Basic GUI Structure

Layout System

Row Definition

Slot Mappings

GUI Sizes

Item Configuration

Background and Border Items

Button Items

Tab Icons

Custom Item Overrides

Styling System

Title and Colors

Title Formatting

Visual Effects

Complete Examples

Example 1: Simple Confirmation Dialog

Example 2: Tab-Based Browser

Example 3: Filter Interface

Best Practices

Layout Design

Item Selection

Styling

Reloading GUIs

Troubleshooting

GUI Not Loading

Items Not Displaying

Layout Issues

Related Systems