Skip to main content

A module filter.

Combine CSS

CSS

Combines multiple stylesheet files into one to cut HTTP requests.

Filter combine_css · Filter docs · Read the full guide

Original Open in new tab
Optimized Open in new tab

Both frames render identically — that's the goal. The win is in the bytes and requests below, not the look. They're served live by the mod_pagespeed module on demo-httpd-1.1.modpagespeed.com; the optimized frame applies only this filter. Right after a cache purge it may briefly match the original while the worker rewrites it — reload to see the result.

Measured impact

HTTP requests

5 2
−3

Total bytes

original
4,826 B
optimized
4,700 B

−126 B −3% in size

Measured on the demo stack, August 2026.

HTML size

original
435 B
optimized
305 B

−130 B −30% in size

Measured on the demo stack, August 2026.

What changed in the source

The page's HTML, before and after this filter. Red lines are removed, green lines are added. 

                
                  

                        <html>
                    

                          <head>
                    

                            <title>combine_css example</title>
                    

                      -     <link rel="stylesheet" type="text/css" href="styles/yellow.css">
                    

                      -     <link rel="stylesheet" type="text/css" href="styles/blue.css">
                    

                      -     <link rel="stylesheet" type="text/css" href="styles/big.css">
                    

                      -     <link rel="stylesheet" type="text/css" href="styles/bold.css">
                    

                      +     <link rel="stylesheet" type="text/css" href="styles/yellow.css+blue.css+big.css+bold.css.pagespeed.cc.xo4He3_gYf.css"/>
                    

                      +     
                    

                      +     
                    

                      +     
                    

                          </head>
                    

                          <body>
                    

                            <div class="blue yellow big bold">

Run this on your own site

This is one of 49 filters the mod_pagespeed module applies in place — self-hosted on Apache, nginx, and IIS. Install and run it: it optimizes right away and adds the optimized response headers shown above. Open source under the Apache License 2.0 — free in development and in production.

Download & run
← All optimization examples

Search