स्पेस और माप के टोकन
स्पेसिंग स्केल, न्यूनतम टार्गेट, आइकन के साइज़, बॉर्डर की चौड़ाई और फ़ोकस रिंग के माप।
tanrei.sys के अंतर्गत डाइमेंशन टोकन। मार्गदर्शन के लिए लेआउट और सुलभता पढ़ें।
| टोकन | मान | प्रीव्यू |
|---|---|---|
--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