---
title: "स्पेस और माप के टोकन"
description: "स्पेसिंग स्केल, न्यूनतम टार्गेट, आइकन के साइज़, बॉर्डर की चौड़ाई और फ़ोकस रिंग के माप।"
url: "https://tanrei.chnotchy.com/hi/tokens/space/"
last_updated: 2026-10-23T17:33:05.000Z
---

# स्पेस और माप के टोकन

> स्पेसिंग स्केल, न्यूनतम टार्गेट, आइकन के साइज़, बॉर्डर की चौड़ाई और फ़ोकस रिंग के माप।

`tanrei.sys` के अंतर्गत डाइमेंशन टोकन। मार्गदर्शन के लिए [लेआउट](https://tanrei.chnotchy.com/hi/foundations/layout/) और [सुलभता](https://tanrei.chnotchy.com/hi/foundations/accessibility/) पढ़ें।

## स्पेस

| टोकन | मान | प्रीव्यू |
| --- | --- | --- |
| `--tanrei-sys-space-space0` | 0px |  |
| `--tanrei-sys-space-space25` | 2px |  |
| `--tanrei-sys-space-space50` | 4px |  |
| `--tanrei-sys-space-space75` | 6px |  |
| `--tanrei-sys-space-space100` | 8px |  |
| `--tanrei-sys-space-space125` | 10px |  |
| `--tanrei-sys-space-space150` | 12px |  |
| `--tanrei-sys-space-space175` | 14px |  |
| `--tanrei-sys-space-space200` | 16px |  |
| `--tanrei-sys-space-space250` | 20px |  |
| `--tanrei-sys-space-space300` | 24px |  |
| `--tanrei-sys-space-space400` | 32px |  |
| `--tanrei-sys-space-space450` | 36px |  |
| `--tanrei-sys-space-space500` | 40px |  |
| `--tanrei-sys-space-space600` | 48px |  |
| `--tanrei-sys-space-space700` | 56px |  |
| `--tanrei-sys-space-space800` | 64px |  |
| `--tanrei-sys-space-space900` | 72px |  |

इससे जनरेट किया गया: `design/tokens/tanrei.light.tokens.json`, `tokens/sys/space.tokens.json`

## न्यूनतम टार्गेट

The least sizes of what a person presses. minimum is the least height (and, for an icon-only control, width) anything pressable is drawn at; touch and pointer are the least hit areas, which a control reaches past what it draws where it stands alone.

| टोकन | मान | प्रीव्यू |
| --- | --- | --- |
| `--tanrei-sys-target-minimum` | 32px |  |
| `--tanrei-sys-target-pointer` | 44px |  |
| `--tanrei-sys-target-spacing` | 8px |  |
| `--tanrei-sys-target-touch` | 48px |  |

इससे जनरेट किया गया: `design/tokens/tanrei.light.tokens.json`, `tokens/sys/measure.tokens.json`

## आइकन

| टोकन | मान | प्रीव्यू |
| --- | --- | --- |
| `--tanrei-sys-icon-extra-small` | 16px |  |
| `--tanrei-sys-icon-large` | 32px |  |
| `--tanrei-sys-icon-medium` | 24px |  |
| `--tanrei-sys-icon-small` | 20px |  |

इससे जनरेट किया गया: `design/tokens/tanrei.light.tokens.json`, `tokens/sys/measure.tokens.json`

## बॉर्डर

| टोकन | मान | प्रीव्यू |
| --- | --- | --- |
| `--tanrei-sys-border-hairline` | 1px |  |
| `--tanrei-sys-border-thick` | 2px |  |

इससे जनरेट किया गया: `design/tokens/tanrei.light.tokens.json`, `tokens/sys/measure.tokens.json`

## फ़ोकस रिंग

The focus indicator, from the control outwards: \`offset\` (negative = drawn inside the control), then an optional inner stroke in sys.color.focus-ring-inner, then the outer stroke in sys.color.focus-ring. Never animated.

| टोकन | मान | प्रीव्यू |
| --- | --- | --- |
| `--tanrei-sys-focus-inner-width` | 0px |  |
| `--tanrei-sys-focus-offset` | 2px |  |
| `--tanrei-sys-focus-outer-width` | 2px |  |

इससे जनरेट किया गया: `design/tokens/tanrei.light.tokens.json`, `tokens/sys/measure.tokens.json`