Breakpoints management for responsive web design.

Breakpoints defined by a theme

A theme can define multipliers and breakpoints in the file like

breakpoints[mobile] = (min-width: 0px)
breakpoints[narrow] = (min-width: 560px)
breakpoints[wide] = (min-width: 851px)
breakpoints[tv] = only screen and (min-width: 3456px)

multipliers[mobile][] = 1.5x
multipliers[mobile][] = 2x

Once this module or the theme is enabled, the settings are read from the info file and stored into the database.

Custom breakpoints

A user can create custom breakpoints using full media queries to define them.

Breakpoint groups

Breakpoints can be grouped together, for each theme that defines breakpoints there's automatically a new group created.
A user can define extra groups.


If you want to support retina displays, you can enable multipliers so the modules now you want to use a breakpoint for both regular display and retina display.

Why groups? So other modules like Picture can act on the separate groups to handle the output.

Modules using breakpoints

Donate or Flattr to support further development.

Supporting organizations: 

Project information