Atomic Bulldog - UI/pattern library

6.12 - z-index

Source: variables/_z-index.scss, line 27

Open in new window

z-index are in the map $z-indexes. The first entry will get the highest value and the last one the lowest. You can find an example in this pen


  • skip-navigation
  • main-navigation

z-index indexes can be called in the sass project using the functions:

z($name) which will output the reverse index of $name time 10

Usage of font-size():

  • z(main-navigation) => 10

See the Pen z-index Sass management by Vincent Humeau (@vinceumo) on CodePen.