#header CSS effects

8 free, pure-CSS effects match the "header" tag. Each is copy-ready and needs no library or build step.

Each header label is prefixed by a small icon drawn purely from borders and shadows.

The header stays pinned with position sticky while the body scrolls underneath.

The header floats as its own card above the body block with a real gap between them.

A wide gradient band sweeps across the header row in a slow continuous loop.

A two pixel gradient thread runs under the header row and drifts across it forever.

The header separates itself with wide tracking, small caps weight and a thick rule.

Header cells carry sort carets and the active one nudges up and down gently.

Header buttons show a stacked caret pair and the active column lights its lower caret.

Popular tags