Critical CSS is the minimal set of CSS rules required to render the above-the-fold content of a page without any external stylesheet requests, inlined directly into the <head> of the HTML document. By delivering these styles inline, the browser can paint the visible portion of the page immediately on first render, eliminating the round-trip latency of an external stylesheet and reducing First Contentful Paint and Largest Contentful Paint times. The remaining non-critical CSS is then loaded asynchronously — commonly via a <link> tag with media="print" that is switched to all on load, or using JavaScript. Tools such as Critical, Penthouse, and Critters can automatically extract critical CSS from a URL. The technique is particularly effective on slow mobile connections where every eliminated render-blocking request has a measurable impact on Core Web Vitals. The trade-off is added HTML page weight and build complexity, as the critical CSS must be regenerated whenever styles change.