---
title: "Gap classes"
description: "Gap utilities for the `gap` token scale."
requested_language: sk
language: en
translation_notice: "This page isn't translated yet"
url: https://docs.systhema.app/sk/next/reference/utilities/gap
version: unreleased (main)
docs_index: https://docs.systhema.app/sk/next/llms.txt
---
> This page isn't translated yet. Showing English.


<!-- generated by pnpm docs:generate; do not edit -->

| Class        | Styles                         |
| ------------ | ------------------------------ |
| `gap-none`   | `gap: var(--gap-none);`        |
| `gap-x-none` | `column-gap: var(--gap-none);` |
| `gap-y-none` | `row-gap: var(--gap-none);`    |
| `gap-xs`     | `gap: var(--gap-xs);`          |
| `gap-x-xs`   | `column-gap: var(--gap-xs);`   |
| `gap-y-xs`   | `row-gap: var(--gap-xs);`      |
| `gap-sm`     | `gap: var(--gap-sm);`          |
| `gap-x-sm`   | `column-gap: var(--gap-sm);`   |
| `gap-y-sm`   | `row-gap: var(--gap-sm);`      |
| `gap-md`     | `gap: var(--gap-md);`          |
| `gap-x-md`   | `column-gap: var(--gap-md);`   |
| `gap-y-md`   | `row-gap: var(--gap-md);`      |
| `gap-lg`     | `gap: var(--gap-lg);`          |
| `gap-x-lg`   | `column-gap: var(--gap-lg);`   |
| `gap-y-lg`   | `row-gap: var(--gap-lg);`      |
| `gap-xl`     | `gap: var(--gap-xl);`          |
| `gap-x-xl`   | `column-gap: var(--gap-xl);`   |
| `gap-y-xl`   | `row-gap: var(--gap-xl);`      |
| `gap-2xl`    | `gap: var(--gap-2xl);`         |
| `gap-x-2xl`  | `column-gap: var(--gap-2xl);`  |
| `gap-y-2xl`  | `row-gap: var(--gap-2xl);`     |
| `gap-3xl`    | `gap: var(--gap-3xl);`         |
| `gap-x-3xl`  | `column-gap: var(--gap-3xl);`  |
| `gap-y-3xl`  | `row-gap: var(--gap-3xl);`     |