Display
Electrons → photons
The GPU writes the frame buffer, a display cable (DisplayPort, HDMI, or internal eDP) carries the signal to the monitor, and the panel energizes individual pixels.
How It Works
The GPU's compositing output is a frame buffer — a bitmap of pixels in memory (e.g., 3840×2160×4 bytes = ~33 MB per frame at 4K). The display controller reads this buffer and serializes it into a video signal that travels over DisplayPort, HDMI, or (for laptop panels) eDP. Modern displays run at 60–240 Hz, meaning this entire buffer is transmitted 60–240 times per second.
The display panel converts electrical signals to light. In an LCD, a backlight (LEDs) provides constant illumination, and liquid crystal cells act as shutters — twisting to block or pass light for each subpixel (red, green, blue). In an OLED, each subpixel is an individual organic LED that emits its own light — no backlight needed, enabling true black (the pixel is simply off). Each pixel you see is the blended result of three tiny colored lights at a specific intensity, viewed from roughly 50 cm away.
The Signal Flow
Key Concepts
A region of GPU memory holding the pixel data for the current frame. At 4K (3840×2160), 32-bit color, that's ~33 MB per frame. Double buffering uses two: the GPU renders to one while the display reads the other.
Vertical synchronization — the display reads the frame buffer top-to-bottom during the vertical active period, then briefly pauses (vertical blanking interval). The GPU swaps to the new frame buffer during this pause to prevent tearing (showing parts of two different frames).
LCD uses a shared backlight filtered through liquid crystals — efficient but can't achieve true black (backlight always leaks). OLED uses individual self-emitting pixels — true black, infinite contrast ratio, but potential burn-in for static content.
Each pixel has three subpixels (R, G, B) arranged physically side by side. Subpixel rendering (ClearType on Windows, macOS default) uses this layout to achieve ~3x horizontal resolution for text by individually controlling each color channel.
Deep Dive
The display pipeline
Modern GPUs use a tile-based rendering architecture. The frame is divided into small tiles (16×16 or 32×32 pixels). Each tile is rendered independently in fast on-chip memory (SRAM), then written to the frame buffer in VRAM. This is more power-efficient than scanning the entire frame at once. The display controller then reads the frame buffer using DMA (Direct Memory Access), serializes it into a video standard (DisplayPort uses micro-packets at up to 80 Gbps), and transmits it to the monitor.
Color accuracy
Displays map pixel values to light through a transfer function (gamma curve). sRGB is the web's standard color space — 8 bits per channel, ~16.7 million colors, gamma 2.2. Wide-gamut displays (P3, Adobe RGB) can reproduce more saturated colors. HDR (High Dynamic Range) uses 10-bit color and the PQ (Perceptual Quantizer) transfer function for brighter highlights and deeper shadows. The CSS color() function and media queries (prefers-color-scheme, dynamic-range) let web content adapt to display capabilities.