Breakpoint

Min-Width

List of design token names, values and metadata for

Name	Value
min-width-breakpoint-mobile	320px Defined in src/application.json Refers to size.viewport.32 A mobile device's minimum available screen width. Many older feature phones have screens smaller than this value.
min-width-breakpoint-tablet	640px Defined in src/application.json Refers to size.viewport.64 A tablet device's minimum available screen width. Note: the size chosen is eager to be re-evaluated with Web team and Product Analytics.
min-width-breakpoint-desktop	1120px Defined in src/application.json Refers to size.viewport.112 A desktop device's minimum available screen width.
min-width-breakpoint-desktop-wide	1680px Defined in src/application.json Refers to size.viewport.168 A wider desktop's minimum available screen width.

Max-Width

List of design token names, values and metadata for

Name	Value
max-width-breakpoint-mobile	calc( 640px - 1px ) Defined in src/application.json Refers to size.viewport.64 Refers to size.absolute.1 A mobile device's maximum available screen width. Many older feature phones have screens smaller than this value.
max-width-breakpoint-tablet	calc( 1120px - 1px ) Defined in src/application.json Refers to size.viewport.112 Refers to size.absolute.1 A tablet device's maximum available screen width. Note, the size chosen is eager to be re-evaluated with Web team and Product Analytics.
max-width-breakpoint-desktop	calc( 1680px - 1px ) Defined in src/application.json Refers to size.viewport.168 Refers to size.absolute.1 A desktop device's maximum available screen width.