När du använder standarddesign kommer systemet att tillämpa olika brytpunkter vid växling mellan mobil, surfplatta och stationär dator. Brytpunkterna är:

Minimal

• Skärmstorlek under 321 px i bredd eller 321 px i höjd
• Teckenstorleken är inställd på 0,38
• Radavståndet är inställt på 1,05 em
• Avståndet i rutan har minskats till 5px
• Skärmstorlek under 450×450: Rutan anpassas till 100%100%

Mobil: Stående

• Skärmstorlek under 480 px i bredd och 926 px i höjd
• Rutans bredd utökad till 100 % och minsta höjd 300 px
• Knapparna placeras under innehållet
• Logotypen är dold
• Uppfyllnadsord har reducerats
• Tillägg: Om skärmstorleken är mindre än 414×736 eller 736×414 (t.ex. iPhone 6/7/8) minskas rutan

Mobil: Liggande

• Skärmstorlek under 926 px i bredd och 480 px i höjd
• Rutans bredd utökad till 100 % och minsta höjd 150 px
• Knapparna placeras till höger om innehållet med en bredd på 250 px
• Logotypen är dold
• Uppfyllnadsord har reducerats
• Tillägg: Om skärmstorleken är mindre än 414×736 eller 736×414 (t.ex. iPhone 6/7/8) minskas avståndet i rutan

Dator & surfplatta

• Skärmstorlek över 926×480 eller 480×926

Ytterligare medieförfrågningar

Lager placerade som "botten/full bredd", "topp/full bredd" och "Skjut nedåt":

• Maxbredd 1500px: Innehållet (rubrik, text och syften) i samtyckeslagret kommer att reduceras till ”100 % – 450px” för att knapparna ska kunna visas till höger om innehållet.
• Maxbredd 1200px: Innehållet (rubrik, text och syften) i samtyckeslagret kommer att reduceras till ”100 % – 250px” för att visa knapparna till höger om innehållet. Detta
• Maxbredd 800 px: Innehållet (rubrik, text och syften) i samtyckeslagret kommer att utökas till 100 % för att visa knapparna under innehållet.

Lager placerade som "nedre/höger", "nedre/mitten", "mitten/mitten" och "övre/mitten":

• Maxbredd 600px: Rutan anpassas till 100 % bredd.

Lager placerade som "mitt/center":

• Maxhöjd 600px och minbredd 926px: Rutan anpassas till full höjd och innehållet ställs in på flex med overflow auto för att förhindra att rutan blir för hög för fönstret.

Lager placerade som ”höger/full höjd” och ”vänster/full höjd”:

• Maxbredd 400px: Rutan anpassas till 100 % bredd.

Sidan för anpassade inställningar:

• Maxbredd 570px: Navigeringen har flyttats upp till toppen för att ge tillräckligt med utrymme åt innehållet