How to Use Math Operators with ImVec2 and ImVec4 in Dear ImGui

To enable arithmetic operations on Dear ImGui's vector types, define IMGUI_DEFINE_MATH_OPERATORS before including imgui.h to unlock component-wise addition, subtraction, multiplication, division, and comparison operators for ImVec2 and ImVec4.

Dear ImGui provides lightweight ImVec2 and ImVec4 structs for positions, sizes, and colors, but these types expose only raw members by default. When you need to perform vector math without manual member access, you must explicitly opt-in to the courtesy math operators provided in the ocornut/imgui repository.

Enabling Courtesy Math Operators

The math operators are conditionally compiled to keep the header lightweight for projects that do not require them. They reside in imgui.h (lines 2935–2974) inside an #ifdef IMGUI_DEFINE_MATH_OPERATORS block.

To activate them, define the macro in one of two ways:

Option 1: Global configuration in imconfig.h

// imconfig.h
#define IMGUI_DEFINE_MATH_OPERATORS

Option 2: Per-translation unit definition

#define IMGUI_DEFINE_MATH_OPERATORS
#include "imgui.h"

The macro must be visible before imgui.h is processed, as the operator implementations are inline functions that appear immediately after the ImVec2 and ImVec4 struct definitions.

Available Operators for ImVec2 and ImVec4

Once enabled, both structs support full arithmetic semantics:

  • Binary arithmetic: +, -, *, / (component-wise for vector-vector, standard math for vector-scalar)
  • Compound assignment: +=, -=, *=, /= (modify in-place)
  • Comparison: ==, != (exact float comparison)
  • Unary negation: - (for ImVec2)

The operators are implemented as inline free functions that return fresh vectors or references for compound assignments. Scalar multiplication supports both left-hand and right-hand scalar operands (e.g., vec * 2.0f and 2.0f * vec).

Practical Code Examples

Vector2 Arithmetic with ImVec2

ImVec2 a(10.0f, 20.0f);
ImVec2 b(5.0f, 3.0f);

// Basic arithmetic
ImVec2 sum = a + b;           // (15.0, 23.0)
ImVec2 diff = a - b;          // (5.0, 17.0)
ImVec2 prod = a * b;          // component-wise: (50.0, 60.0)
ImVec2 quot = a / b;          // component-wise: (2.0, 6.6667)

// Scalar operations
ImVec2 scaled = a * 2.0f;     // (20.0, 40.0)
ImVec2 inv = 2.0f * a;        // (20.0, 40.0)

// Compound assignments
a += b;                       // a becomes (15.0, 23.0)
a *= 0.5f;                    // a becomes (7.5, 11.5)

// Equality test
bool same = (a == ImVec2(7.5f, 11.5f));  // true

Color Operations with ImVec4

ImVec4 colA(0.2f, 0.4f, 0.6f, 1.0f);
ImVec4 colB(0.1f, 0.1f, 0.1f, 0.5f);

// Color blending (component-wise addition)
ImVec4 blended = colA + colB;          // (0.3, 0.5, 0.7, 1.5)

// Scalar darkening
ImVec4 darker = colA * 0.5f;           // (0.1, 0.2, 0.3, 0.5)

// Component-wise tinting
ImVec4 tinted = colA * colB;           // (0.02, 0.04, 0.06, 0.5)

// In-place adjustment
colA -= ImVec4(0.05f, 0.05f, 0.05f, 0.0f);  // (0.15, 0.35, 0.55, 1.0)

Source Code Structure

The implementation lives in imgui.h immediately following the struct definitions:

  • ImVec2 (lines 2951–2954): POD struct with float x, y
  • ImVec4 (lines 2961–2964): POD struct with float x, y, z, w
  • Math operators (lines 2935–2974): Wrapped in #ifdef IMGUI_DEFINE_MATH_OPERATORS

For advanced customization, imconfig.h provides hooks to inject your own conversion operators without modifying Dear ImGui source:

// imconfig.h
#define IM_VEC2_CLASS_EXTRA                                                 \
        ImVec2(const MyVec2& f) { x = f.x; y = f.y; }                       \
        operator MyVec2() const { return MyVec2(x,y); }

This allows seamless interoperability between Dear ImGui vectors and your project's math library.

Summary

  • Define IMGUI_DEFINE_MATH_OPERATORS before including imgui.h to enable operators.
  • Operators include component-wise +, -, *, / and scalar multiplication for both ImVec2 and ImVec4.
  • Compound assignment operators (+=, *=, etc.) modify vectors in-place.
  • Equality operators perform direct float comparison without epsilon.
  • Customize vector behavior via IM_VEC2_CLASS_EXTRA and IM_VEC4_CLASS_EXTRA in imconfig.h.

Frequently Asked Questions

Why are math operators disabled by default in Dear ImGui?

Dear ImGui prioritizes compilation speed and header cleanliness. By wrapping operators in IMGUI_DEFINE_MATH_OPERATORS, the library avoids polluting the global namespace for projects that use their own math types or do not need arithmetic on ImGui vectors.

Can I use these operators with my own math library?

Yes. Instead of using the built-in operators, you can define IM_VEC2_CLASS_EXTRA or IM_VEC4_CLASS_EXTRA in imconfig.h to add implicit constructors and conversion operators. This lets you pass your own vector types directly to ImGui functions while using your library's native operators.

Do the operators perform component-wise multiplication?

Yes. When multiplying two ImVec2 or two ImVec4 objects, the operation is component-wise (result.x = a.x * b.x). When multiplying by a scalar, all components scale uniformly (result.x = a.x * scalar).

What happens if I forget to define IMGUI_DEFINE_MATH_OPERATORS?

Without the macro, ImVec2 and ImVec4 expose only their member variables (x, y, z, w) and an index operator. Attempting to use +, -, or other arithmetic operators will result in compilation errors indicating that no operator matches those operands.

Have a question about this repo?

These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:

Share the following with your agent to get started:
curl -s "https://instagit.com/install.md"

Works with
Claude Codex Cursor VS Code OpenClaw Any MCP Client

Maintain an open-source project? Get it listed too →