Number systems are everywhere in computing: the CSS value #1A2B3C, the memory address 0x7FFFFFFF, a Base64-encoded image, the %20 in a URL — all of these trace back to one idea: number systems (bases). Once you understand how they work, a surprising amount of "magic" in computing becomes transparent.
What Is a Number Base?
A number base defines how many symbols are used to represent numbers. In everyday decimal (Base-10), we use 10 symbols (0–9); after 9, we carry over to get 10. The same carry-over logic applies in every other base:
- Binary (Base-2): only 0 and 1; after 1, carry over to get 10 (which represents decimal 2)
- Octal (Base-8): digits 0–7; carry over after 7
- Hexadecimal (Base-16): digits 0–9 plus A–F (A=10, B=11, …, F=15); carry over after F
| Decimal | Binary | Octal | Hex |
|---|---|---|---|
| 0 | 0000 | 0 | 0 |
| 8 | 1000 | 10 | 8 |
| 10 | 1010 | 12 | A |
| 15 | 1111 | 17 | F |
| 16 | 10000 | 20 | 10 |
| 255 | 11111111 | 377 | FF |
Binary (Base-2)
Binary is the native language of computer hardware. An electrical circuit has exactly two states — on and off — which map directly to 1 and 0. A single binary digit is called a bit; eight bits form a byte.
Decimal → Binary
Repeatedly divide by 2 and record remainders; read them from bottom to top.
13 ÷ 2 = 6 remainder 1 ↑
6 ÷ 2 = 3 remainder 0 ↑
3 ÷ 2 = 1 remainder 1 ↑
1 ÷ 2 = 0 remainder 1 ↑
Result: 1101 (decimal 13 = binary 1101)
Binary → Decimal
Multiply each digit by its corresponding power of 2 and sum them.
1101 = 1×2³ + 1×2² + 0×2¹ + 1×2⁰
= 8 + 4 + 0 + 1
= 13
Hexadecimal (Base-16)
Hexadecimal is the most common non-decimal base in programming, for one key reason: every 4 bits maps exactly to one hex digit.
Binary: 1111 1010 1011 1100
Hexadecimal: F A B C → FABC
This makes hex the ideal compact format for memory addresses, color codes, and hash outputs — shorter than binary, yet in perfect correspondence with the underlying bits.
Decimal → Hex
Repeatedly divide by 16; remainders 10–15 are written as A–F.
255 ÷ 16 = 15 remainder 15 (F) ↑
15 ÷ 16 = 0 remainder 15 (F) ↑
Result: FF (decimal 255 = hex FF)
CSS Color Codes
The CSS color #FF5733 consists of three hex pairs representing R, G, and B:
| Channel | Hex | Decimal (0–255) |
|---|---|---|
| Red (R) | FF | 255 |
| Green (G) | 57 | 87 |
| Blue (B) | 33 | 51 |
#FF5733 is therefore equivalent to rgb(255, 87, 51) — an orange-red color.
Hex in URL Encoding
URLs can only contain a limited set of characters. Anything else — spaces, accented characters, non-ASCII scripts — must be represented using percent encoding: convert the character's UTF-8 bytes to hex and prepend each byte with %.
| Character | URL-encoded | Notes |
|---|---|---|
| Space | %20 | Hex 20 = decimal 32 (ASCII space) |
| / | %2F | When a slash must appear outside path segments |
| é | %C3%A9 | UTF-8 encodes this as 2 bytes |
| @ | %40 | Required in some URL components |
Base64: Another Common Encoding
Base64 is not a number base — it's an encoding scheme that converts binary data into printable ASCII text. It takes every 3 bytes (24 bits) and splits them into four 6-bit groups. Each group maps to one of 64 characters (A–Z, a–z, 0–9, +, /).
Input (ASCII): Man
Binary: 01001101 01100001 01101110
6-bit groups: 010011 010110 000101 101110
Base64: T W F u → TWFu
Base64 output is about 33% larger than the source (every 3 bytes becomes 4 characters), but it can travel safely through text-only channels like email bodies, HTML attributes, and JSON values.
Number Base Literals in Programming Languages
| Language | Binary | Octal | Hex |
|---|---|---|---|
| Python | 0b1010 | 0o12 | 0xA |
| JavaScript | 0b1010 | 0o12 | 0xA |
| C / C++ | — (no native literal) | 012 | 0xA |
| Java | 0b1010 | 012 | 0xA |
| CSS | — | — | #FF5733 |
Quick Reference: Common Uses by Base
- Binary: CPU instructions, bitwise operations, file permission flags (chmod uses octal as a compact binary shorthand)
- Octal: Unix file permissions (
chmod 755— each digit is 3 bits: read/write/execute) - Hex: Color codes, memory addresses, hash outputs, byte-level inspection, network packet analysis
- Base64: Email attachments, data URIs for images, JWT tokens, API payloads
Summary
Number systems aren't abstract theory — they're the vocabulary underlying much of modern software:
- Binary is the hardware layer; every bit, byte, and bitwise operation depends on it
- Hexadecimal is the programmer's shorthand: color codes, memory addresses, and hash outputs are all hex
- Base64 solves the problem of transmitting binary data through text-only channels
- URL encoding uses hex to represent disallowed characters, letting any text appear safely in a URL
Once you internalize these systems, strings like %C3%A9, #FF5733, and TWFu stop looking like noise and start making immediate sense.