---
title: "Breakpoints"
date: 2023-12-19
author: "nK"
---

# Breakpoints

Ghost Kit uses a wide range of responsive settings in blocks. These settings are designed to ensure optimal display across predefined 4 screen sizes, which you can customize in Breakpoints settings.

Ghost Kit employs a desktop-first approach, where the calculations for responsiveness start from larger screens and progressively adapt to smaller ones. This approach allows for a seamless user experience across different devices.

![Breakpoints settings](https://www.ghostkit.io/wp-content/uploads/2023/12/Shot-2023-12-19-at-19.19.37-1024x685.png)     AllDesktopLaptopTabletMobileScreen sizeAll≤ 1200px≤ 992px≤ 768px≤ 576pxFor example, the media query for a Tablet looks like this:

```
@media (max-width: 768px) {
  ...
}
```