René's URL Explorer Experiment

Title: Breakpoints - Material UI

Open Graph Title: Breakpoints - Material UI

X Title: Breakpoints - Material UI

Description: API that enables the use of breakpoints in a wide variety of contexts.

Open Graph Description: API that enables the use of breakpoints in a wide variety of contexts.

X Description: API that enables the use of breakpoints in a wide variety of contexts.

Opengraph URL: https://mui.com/material-ui/customization/breakpoints/

X: @MUI_hq

direct link

Domain: mui.com

mui:productId	material-ui
mui:productCategoryId	core
twitter:card	summary_large_image
twitter:image	https://mui.com/edge-functions/og-image?product=Material UI&title=Breakpoints&description=API that enables the use of breakpoints in a wide variety of contexts.
og:type	website
og:image	https://mui.com/edge-functions/og-image?product=Material UI&title=Breakpoints&description=API that enables the use of breakpoints in a wide variety of contexts.
og:ttl	604800
docsearch:language	en
docsearch:version	master
theme-color	hsl(210, 14%, 7%)

Links:

Skip to content	https://mui.com/material-ui/customization/breakpoints/#main-content
	https://mui.com/
🚀 Influence MUI's 2026 roadmap! Take our latest Developer Survey	https://tally.so/r/3jOKG1?source=docs-banner
	https://github.com/mui/material-ui
	https://mui.com/
Getting started	https://mui.com/material-ui/getting-started/
Components	https://mui.com/material-ui/all-components/
Component API	https://mui.com/material-ui/api/accordion/
Customization	https://mui.com/material-ui/customization/how-to-customize/
How to customize	https://mui.com/material-ui/customization/how-to-customize/
Overriding component structure	https://mui.com/material-ui/customization/overriding-component-structure/
Dark mode	https://mui.com/material-ui/customization/dark-mode/
Color	https://mui.com/material-ui/customization/color/
Right-to-left	https://mui.com/material-ui/customization/right-to-left/
Shadow DOM	https://mui.com/material-ui/customization/shadow-dom/
Default theme viewer	https://mui.com/material-ui/customization/default-theme/
Customizing the theme	https://mui.com/material-ui/customization/theming/
Creating themed components	https://mui.com/material-ui/customization/creating-themed-components/
Components	https://mui.com/material-ui/customization/theme-components/
Palette	https://mui.com/material-ui/customization/palette/
Typography	https://mui.com/material-ui/customization/typography/
Spacing	https://mui.com/material-ui/customization/spacing/
Shape	https://mui.com/material-ui/customization/shape/
Breakpoints	https://mui.com/material-ui/customization/breakpoints/
Container queriesNew	https://mui.com/material-ui/customization/container-queries/
Density	https://mui.com/material-ui/customization/density/
z-index	https://mui.com/material-ui/customization/z-index/
Transitions	https://mui.com/material-ui/customization/transitions/
Overview	https://mui.com/material-ui/customization/css-theme-variables/overview/
Basic usage	https://mui.com/material-ui/customization/css-theme-variables/usage/
Native color	https://mui.com/material-ui/customization/css-theme-variables/native-color/
Advanced configuration	https://mui.com/material-ui/customization/css-theme-variables/configuration/
Cascade layersNew	https://mui.com/material-ui/customization/css-layers/
How-to guides	https://mui.com/material-ui/guides/building-extensible-themes/
Integrations	https://mui.com/material-ui/integrations/tailwindcss/tailwindcss-v4/
Experimental APIs	https://mui.com/material-ui/experimental-api/classname-generator/
Migration	https://mui.com/material-ui/migration/upgrade-to-grid-v2/
Discover more	https://mui.com/material-ui/discover-more/showcase/
Design resources	https://mui.com/material-ui/design-resources/material-ui-for-figma/
Template store	https://mui.com/store/%3Futm_source=docs&utm_medium=referral&utm_campaign=sidenav
specification	https://m2.material.io/design/layout/responsive-layout-grid.html#breakpoints
Grid	https://mui.com/material-ui/react-grid/
Default breakpoints	https://mui.com/material-ui/customization/breakpoints/#default-breakpoints
customized	https://mui.com/material-ui/customization/breakpoints/#custom-breakpoints
CSS Media Queries	https://mui.com/material-ui/customization/breakpoints/#css-media-queries
theme.breakpoints.up(key)	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-up-key-media-query
theme.breakpoints.down(key)	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-down-key-media-query
theme.breakpoints.only(key)	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-only-key-media-query
theme.breakpoints.not(key)	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-not-key-media-query
theme.breakpoints.between(start, end)	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-between-start-end-media-query
JavaScript Media Queries	https://mui.com/material-ui/customization/breakpoints/#javascript-media-queries
useMediaQuery hook	https://mui.com/material-ui/customization/breakpoints/#usemediaquery-hook
useMediaQuery	https://mui.com/material-ui/react-use-media-query/
Custom breakpoints	https://mui.com/material-ui/customization/breakpoints/#custom-breakpoints
theme.breakpoints.values	https://mui.com/material-ui/customization/default-theme/?expand-path=$.breakpoints.values
above values	https://mui.com/material-ui/customization/breakpoints/#default-breakpoints
module augmentation	https://mui.com/material-ui/guides/typescript/#customization-of-theme
API	https://mui.com/material-ui/customization/breakpoints/#api
theme.breakpoints.up(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-up-key-media-query
theme.breakpoints.down(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-down-key-media-query
theme.breakpoints.only(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-only-key-media-query
theme.breakpoints.not(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-not-key-media-query
theme.breakpoints.between(start, end) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-between-start-end-media-query
Default values	https://mui.com/material-ui/customization/breakpoints/#default-values
the theme explorer	https://mui.com/material-ui/customization/default-theme/?expand-path=$.breakpoints
Edit this page	https://github.com/mui/material-ui/edit/master/docs/data/material/customization/breakpoints/breakpoints.md
Shape	https://mui.com/material-ui/customization/shape/
Container queries	https://mui.com/material-ui/customization/container-queries/
	https://mui.com/
Blog	https://mui.com/blog/
Store	https://mui.com/store/
	https://x.com/MUI_hq
	https://mui.com/r/discord/
	https://www.youtube.com/@MUI_hq
	https://mui.com/feed/blog/rss.xml
Default breakpoints	https://mui.com/material-ui/customization/breakpoints/#default-breakpoints
CSS Media Queries	https://mui.com/material-ui/customization/breakpoints/#css-media-queries
JavaScript Media Queries	https://mui.com/material-ui/customization/breakpoints/#javascript-media-queries
useMediaQuery hook	https://mui.com/material-ui/customization/breakpoints/#usemediaquery-hook
Custom breakpoints	https://mui.com/material-ui/customization/breakpoints/#custom-breakpoints
API	https://mui.com/material-ui/customization/breakpoints/#api
theme.breakpoints.up(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-up-key-media-query
theme.breakpoints.down(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-down-key-media-query
theme.breakpoints.only(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-only-key-media-query
theme.breakpoints.not(key) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-not-key-media-query
theme.breakpoints.between(start, end) => media query	https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-between-start-end-media-query
Default values	https://mui.com/material-ui/customization/breakpoints/#default-values
	https://www.doit.com/?utm_source=mui.com&utm_medium=referral
Become a Diamond sponsor	https://mui.com/material-ui/discover-more/backers/#diamond-sponsors
MUI stands in solidarity with Ukraine.	https://war.ukraine.ua/support-ukraine/

Viewport: initial-scale=1, width=device-width

URLs of crawlers that visited me.