Open the CSS Color Picker in any browser devtools and you're looking at bitwise packing in action: an RGBA color like rgba(58, 127, 217, 0.8) is often stored internally as a single 32-bit integer, with each channel occupying its own 8-bit slice — extracting the blue channel is just a shift and an AND against 0xFF.
AND, OR, XOR, NOT — the four building blocks
- AND (&) — the result bit is 1 only when both input bits are 1. Used to isolate one channel from a packed color or extract one flag from a mask.
- OR (|) — the result bit is 1 when at least one input bit is 1. Used to merge separate flags or channels into a single value.
- XOR (^) — the result bit is 1 when the input bits differ; applying XOR twice with the same value returns the original.
- NOT (~) — inverts every bit of a number.
How bitwise AND differs from logical AND
Logical AND (&& in most languages) works on whole boolean values and returns true/false, while bitwise AND (&) processes each bit of two numbers separately and returns a number. Confusing the two is a common source of bugs, especially since some languages let both compile without a type error.
Why this pairs with the base converter
A packed color value of 3866089688 in decimal tells you nothing at a glance, but the same value as 0xE68A57D8 instantly shows four separate byte-sized channels. That's why bitwise logic is almost always reasoned about in binary or hex rather than decimal — the base converter is usually the first stop before AND/OR/XOR make any visual sense.
Why you'd need this
- Efficiently storing and checking a set of boolean flags in a single number.
- Understanding low-level code that works with network protocols or binary formats.
- Optimizing computations where bitwise operations are faster than regular arithmetic.
The Operator Precedence Trap
In most programming languages, the bitwise operators & and | have lower precedence than comparison operators — so an expression like if (a & b == c) actually evaluates as a & (b == c), not as its author intended. This is one of the most common sources of hard-to-spot bugs when working with bit masks, and the reliable way to avoid it is to always parenthesize bitwise operations explicitly.