Breakpoint

Min-Width

List of design token names, values and metadata for
Name	Value
min-width-breakpoint-mobile	`320px` Defined in `src/codex-base.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/codex-base.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/codex-base.json` Refers to `size.viewport.112` A desktop device's minimum available screen width.
min-width-breakpoint-desktop-wide	`1680px` Defined in `src/codex-base.json` Refers to `size.viewport.168` A wider desktop's minimum available screen width.

List of design token names, values and metadata for
Name	Value
max-width-breakpoint-mobile	`calc( 640px - 1px )` Defined in `src/codex-base.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/codex-base.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/codex-base.json` Refers to `size.viewport.168` Refers to `size.absolute.1` A desktop device's maximum available screen width.

List of design token names, values and metadata for
Name	Value
width-breakpoint-mobile deprecated	`320px` Defined in `src/codex-base.json` Refers to `min-width.breakpoint.mobile` Deprecated: Legacy breakpoint. Use `min-width`/`max-width` breakpoint token instead. A mobile device's screen width. Many older feature phones have screens smaller than this value. (use `min-width-breakpoint-mobile` instead)
width-breakpoint-tablet deprecated	`720px` Defined in `src/codex-base.json` Refers to `size.viewport.72` Deprecated: Legacy breakpoint. Use `min-width`/`max-width` breakpoint token instead. A tablet device's screen width. (use `size-viewport-72` instead)
width-breakpoint-desktop deprecated	`1000px` Defined in `src/codex-base.json` Refers to `size.viewport.100` Deprecated: Legacy breakpoint. Use `min-width`/`max-width` breakpoint token instead. A desktop device's screen width. (use `size-viewport-100` instead)
width-breakpoint-desktop-wide deprecated	`1200px` Defined in `src/codex-base.json` Refers to `size.viewport.120` Deprecated: Legacy breakpoint. Use `min-width`/`max-width` breakpoint token instead. A wider desktop's screen width. (use `size-viewport-120` instead)
width-breakpoint-desktop-extrawide deprecated	`2000px` Defined in `src/codex-base.json` Refers to `size.viewport.200` Deprecated: Legacy breakpoint. Use `min-width`/`max-width` breakpoint token instead. An extra wide desktop's screen width. (use `size-viewport-200` instead)