Docs/ORB Inventory/Theming

Theming

ORB Inventory's look is driven by a single file: web/public/config_ui.js. Edit it and restart the resource — no rebuild required.

Editing Colors & Fonts

js
const UI_CONFIG = {
    // Primary accent (buttons, active states, glows)
    primaryColor: '#00f0ff',     // Cyan (ORB default)
    primaryMid:   '#00c4d4',
    primaryDark:  '#007a85',

    // Danger (delete, errors)
    dangerColor: '#ff4444',

    // Backgrounds
    panelBg:       'rgba(19, 19, 19, 0.92)',
    surfaceBg:     'rgba(255, 255, 255, 0.05)',
    surfaceHover:  'rgba(255, 255, 255, 0.1)',
    surfaceActive: 'rgba(255, 255, 255, 0.15)',

    // Text
    textPrimary:   '#ffffff',
    textSecondary: 'rgba(255, 255, 255, 0.6)',
    textMuted:     'rgba(255, 255, 255, 0.35)',

    // Borders
    borderDefault: 'rgba(255, 255, 255, 0.15)',
    borderSubtle:  'rgba(255, 255, 255, 0.08)',
    borderHover:   'rgba(255, 255, 255, 0.25)',

    // Fonts (any Google Font or system font)
    fontHeadline: "'Rajdhani', sans-serif",
    fontBody:     "'Manrope', sans-serif",
};

How It Works

On load, the values above are converted to CSS custom properties (--primary, --danger, etc.) and applied to the interface. To re-theme your inventory, change the colors, save, and run restart ox_inventory_orb.

Tips

  • Use hex (#RRGGBB) or rgb() / rgba() values
  • To match the rest of the ORB suite, keep primaryColor at the default cyan #00f0ff
  • Fonts must be available — system fonts or Google Fonts work out of the box

Locales

ORB Inventory ships with the full ox_inventory locale set (31 languages) under locales/. Add or edit strings there exactly as you would in stock ox_inventory.