Tailwind breakpoints | Sajad Torkamani

Tailwind’s default breakpoints are these:

You can customise or add additional breakpoints by adding theme variables to the --breakpoint-* namespace.

For example, this is the default set of breakpoint variables in the default Tailwind theme.css file:

--breakpoint-sm: 40rem;
--breakpoint-md: 48rem;
--breakpoint-lg: 64rem;
--breakpoint-xl: 80rem;
--breakpoint-2xl: 96rem;

You can add an additional breakpoint like so:

--breakpoint-3xl: 112rem;