A collection of popular layouts and patterns made with CSS

Star me on GitHub ● 6956★

Have you seen CSS Scan?

The fastest and easiest way to check, copy and edit CSS.

Learn more →

Following covers are made with CSS only. Inspect them!

Display

Concave corners

Curved background

Diagonal section

Docked at corner

CSS is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.

Fading long section

Feature comparison

Fixed at corner

Folder structure

Full background

Inverted corners

Keyboard shortcut

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.

Overlay play button

Questions and answers

Sticky table column

Sticky table headers

Three dimensions card

Triangle buttons

Video background

Zigzag timeline

Feedback

Indeterminate progress bar

Presence indicator

Radial progress bar

Resizable element

Validation icon

Layout

Same height columns

Sticky sections

Navigation

Circular navigation

Full screen menu

A
B
- B.1
- B.2
- B.3
  - B.3.1
  - B.3.2
  - B.3.3
  - B.3.4
- B.4
- B.5
C
D

Nested dropdowns

Previous next buttons

Split navigation

Follow me on Twitter and GitHub to get more useful contents.