0
# Utilities & Constants
1

2
Core utilities, device detection, performance helpers, and WebGL constants used throughout the library. PixiJS provides extensive utility functions and constants for common operations.
3

4
## Capabilities
5

6
### Utils Namespace
7

8
Collection of utility functions and classes.
9

10
```typescript { .api }
11
/**
12
 * Utility functions and classes
13
 */
14
const utils: {
15
    /** High-performance event emitter */
16
    EventEmitter: typeof EventEmitter;
17
    
18
    /** Generate unique ID */
19
    uid(): number;
20
    
21
    /** Convert hex to RGB array */
22
    hex2rgb(hex: number, out?: number[]): number[];
23
    
24
    /** Convert hex to CSS string */
25
    hex2string(hex: number): string;
26
    
27
    /** Convert RGB array to hex */
28
    rgb2hex(rgb: number[]): number;
29
    
30
    /** Get resolution from URL */
31
    getResolutionOfUrl(url: string): number;
32
    
33
    /** Check if number is power of 2 */
34
    isPow2(v: number): boolean;
35
    
36
    /** Get next power of 2 */
37
    nextPow2(v: number): number;
38
    
39
    /** Polygon triangulation */
40
    earcut(data: number[], holeIndices?: number[], dim?: number): number[];
41
    
42
    /** Mobile device detection */
43
    isMobile: {
44
        apple: { phone: boolean; ipod: boolean; tablet: boolean; universal: boolean; device: boolean; };
45
        amazon: { phone: boolean; tablet: boolean; device: boolean; };
46
        android: { phone: boolean; tablet: boolean; device: boolean; };
47
        windows: { phone: boolean; tablet: boolean; device: boolean; };
48
        other: { blackberry: boolean; blackberry10: boolean; opera: boolean; firefox: boolean; chrome: boolean; device: boolean; };
49
        any: boolean;
50
        phone: boolean;
51
        tablet: boolean;
52
    };
53
    
54
    /** Sign of number */
55
    sign(n: number): number;
56
    
57
    /** Remove items from array */
58
    removeItems<T>(arr: T[], startIdx: number, removeCount: number): void;
59
    
60
    /** Correct blend mode */
61
    correctBlendMode(blendMode: number, premultiplied: boolean): number;
62
    
63
    /** Premultiply alpha */
64
    premultiplyAlpha(pixels: Uint8Array | Uint8ClampedArray, alpha: number): void;
65
    
66
    /** Premultiply tint */
67
    premultiplyTint(tint: number, alpha: number): number;
68
    
69
    /** Premultiply tint to RGB */
70
    premultiplyTintToRgba(tint: number, alpha: number, out?: Float32Array, premultiplied?: boolean): Float32Array;
71
};
72
```
73

74
### Constants
75

76
WebGL and rendering constants.
77

78
```typescript { .api }
79
/**
80
 * Blend modes for rendering
81
 */
82
enum BLEND_MODES {
83
    NORMAL = 0,
84
    ADD = 1,
85
    MULTIPLY = 2,
86
    SCREEN = 3,
87
    OVERLAY = 4,
88
    DARKEN = 5,
89
    LIGHTEN = 6,
90
    COLOR_DODGE = 7,
91
    COLOR_BURN = 8,
92
    HARD_LIGHT = 9,
93
    SOFT_LIGHT = 10,
94
    DIFFERENCE = 11,
95
    EXCLUSION = 12,
96
    HUE = 13,
97
    SATURATION = 14,
98
    COLOR = 15,
99
    LUMINOSITY = 16,
100
    NORMAL_NPM = 17,
101
    ADD_NPM = 18,
102
    SCREEN_NPM = 19,
103
    SRC_IN = 20,
104
    SRC_OUT = 21,
105
    SRC_ATOP = 22,
106
    DST_OVER = 23,
107
    DST_IN = 24,
108
    DST_OUT = 25,
109
    DST_ATOP = 26,
110
    ERASE = 27,
111
    SUBTRACT = 28,
112
    XOR = 29
113
}
114

115
/**
116
 * Texture scale modes
117
 */
118
enum SCALE_MODES {
119
    NEAREST = 0,
120
    LINEAR = 1
121
}
122

123
/**
124
 * Texture wrap modes
125
 */
126
enum WRAP_MODES {
127
    CLAMP = 0,
128
    REPEAT = 1,
129
    MIRRORED_REPEAT = 2
130
}
131

132
/**
133
 * Mipmap modes
134
 */
135
enum MIPMAP_MODES {
136
    OFF = 0,
137
    POW2 = 1,
138
    ON = 2,
139
    ON_MANUAL = 3
140
}
141

142
/**
143
 * Alpha modes
144
 */
145
enum ALPHA_MODES {
146
    NPM = 0,
147
    UNPACK = 1,
148
    PMA = 2,
149
    NO_PREMULTIPLIED_ALPHA = 0,
150
    PREMULTIPLY_ON_UPLOAD = 1,
151
    PREMULTIPLIED_ALPHA = 2
152
}
153

154
/**
155
 * Clear modes for filters
156
 */
157
enum CLEAR_MODES {
158
    BLEND = 0,
159
    CLEAR = 1,
160
    BLIT = 2
161
}
162

163
/**
164
 * Garbage collection modes
165
 */
166
enum GC_MODES {
167
    AUTO = 0,
168
    MANUAL = 1
169
}
170

171
/**
172
 * Renderer types
173
 */
174
enum RENDERER_TYPE {
175
    UNKNOWN = 0,
176
    WEBGL = 1,
177
    CANVAS = 2
178
}
179

180
/**
181
 * Environment types
182
 */
183
enum ENV {
184
    WEBGL_LEGACY = 0,
185
    WEBGL = 1,
186
    WEBGL2 = 2
187
}
188
```
189

190
**Usage Examples:**
191

192
```typescript
193
import { utils, BLEND_MODES, SCALE_MODES } from "pixi.js";
194

195
// Device detection
196
if (utils.isMobile.any) {
197
    console.log('Running on mobile device');
198
}
199

200
if (utils.isMobile.apple.device) {
201
    console.log('Running on Apple device');
202
}
203

204
// Color utilities
205
const rgb = utils.hex2rgb(0xff0000); // [255, 0, 0]
206
const hex = utils.rgb2hex([0, 255, 0]); // 0x00ff00
207
const cssColor = utils.hex2string(0x0000ff); // "#0000ff"
208

209
// Unique IDs
210
const id1 = utils.uid(); // 1
211
const id2 = utils.uid(); // 2
212

213
// Math utilities
214
console.log(utils.isPow2(64)); // true
215
console.log(utils.nextPow2(100)); // 128
216

217
// Using constants
218
sprite.blendMode = BLEND_MODES.ADD;
219
texture.baseTexture.scaleMode = SCALE_MODES.NEAREST;
220

221
// Event emitter
222
class CustomObject extends utils.EventEmitter {
223
    doSomething() {
224
        this.emit('something-done', { data: 'example' });
225
    }
226
}
227

228
const obj = new CustomObject();
229
obj.on('something-done', (event) => {
230
    console.log('Event received:', event.data);
231
});
232
```