सभी variables
ऑर्डर #1024भुगतान किया गया
3 आइटम, शिप करने के लिए तैयार
आइटम फ़ुलफ़िल करें
कार्ड किसी वेरिएबल को कहाँ इस्तेमाल करता है, यह देखने के लिए उस पर hover या focus करें। कॉपी करने के लिए क्लिक करें।
थीम
इस रूप में कॉपी करें
708 वेरिएबलरंग: पृष्ठभूमि
रंग: टेक्स्ट
रंग: बॉर्डर
रंग: आइकन
रंग: अन्य
स्पेसिंग
--p-space-00rem--p-space-025.0625rem--p-space-050.125rem--p-space-100.25rem--p-space-150.375rem--p-space-200.5rem--p-space-250.625rem--p-space-300.75rem--p-space-4001rem--p-space-5001.25rem--p-space-6001.5rem--p-space-7001.75rem--p-space-8002rem--p-space-10002.5rem--p-space-12003rem--p-space-16004rem--p-space-20005rem--p-space-24006rem--p-space-28007rem--p-space-32008rem--p-space-badge-icon-padding-inline-startvar(--p-space-100)--p-space-badge-icon-padding-inline-start-large.25rem--p-space-badge-padding-inline.375rem--p-space-badge-padding-inline-largevar(--p-space-200)--p-space-button-group-gapvar(--p-space-200)--p-space-card-gapvar(--p-space-400)--p-space-card-paddingvar(--p-space-400)--p-space-choice-margin.0625rem--p-space-choice-size.875rem--p-space-table-cell-paddingvar(--p-space-150)
बॉर्डर रेडियस
--p-border-radius-00rem--p-border-radius-050.125rem--p-border-radius-100.25rem--p-border-radius-150.375rem--p-border-radius-200.5rem--p-border-radius-300.75rem--p-border-radius-4001rem--p-border-radius-5001.25rem--p-border-radius-7501.875rem--p-border-radius-actionvar(--p-border-radius-full)--p-border-radius-avatarclamp(.375rem, 30%, .75rem)--p-border-radius-banner-inner.75rem--p-border-radius-checkbox.25rem--p-border-radius-checkbox-checkedcalc(var(--p-border-radius-checkbox) + .0625rem)--p-border-radius-container1.25rem--p-border-radius-content-highlight.125rem--p-border-radius-control.625rem--p-border-radius-control-inner.375rem--p-border-radius-corner-shapesuperellipse(1.333)--p-border-radius-dialog1.25rem--p-border-radius-element.5rem--p-border-radius-focus.25rem--p-border-radius-full624.9375rem--p-border-radius-mediaclamp(.25rem, 25%, .5rem)--p-border-radius-media-compact.25rem--p-border-radius-option-item.5rem--p-border-radius-popover.75rem--p-border-radius-previewvar(--p-border-radius-full)--p-border-radius-tag.375rem--p-border-radius-tag-inner.25rem--p-border-radius-tag-seam.125rem
बॉर्डर की चौड़ाई
--p-border-width-00rem--p-border-width-025.0625rem--p-border-width-050.125rem--p-border-width-100.25rem--p-border-width-0165.04125rem--p-border-width-outline-input-focusnone
फ़ॉन्ट
--p-font-family-monoui-monospace, SFMono-Regular, 'SF Mono', Consolas, 'Liberation Mono', Menlo, monospaceThe quick brown fox--p-font-family-sans"ShopifyInter", "Noto Sans Arabic", "Noto Sans Hebrew", ui-sans-serif, system-ui, sans-serifThe quick brown fox--p-font-feature-settings'calt' on, 'ss03' on, 'cv09' on, 'cv02' on, 'cv03' on, 'cv04' on0123 Il1 ag--p-font-letter-spacing-body-largevar(--p-font-letter-spacing-normal)Letter spacing--p-font-letter-spacing-body-mediumvar(--p-font-letter-spacing-denser)Letter spacing--p-font-letter-spacing-body-smallvar(--p-font-letter-spacing-dense)Letter spacing--p-font-letter-spacing-body-x-small0remLetter spacing--p-font-letter-spacing-dense-.005emLetter spacing--p-font-letter-spacing-denser-.01emLetter spacing--p-font-letter-spacing-densest-.02emLetter spacing--p-font-letter-spacing-display-largevar(--p-font-letter-spacing-densest)Letter spacing--p-font-letter-spacing-display-mediumvar(--p-font-letter-spacing-densest)Letter spacing--p-font-letter-spacing-display-smallvar(--p-font-letter-spacing-densest)Letter spacing--p-font-letter-spacing-heading-largevar(--p-font-letter-spacing-denser)Letter spacing--p-font-letter-spacing-heading-mediumvar(--p-font-letter-spacing-denser)Letter spacing--p-font-letter-spacing-heading-smallvar(--p-font-letter-spacing-dense)Letter spacing--p-font-letter-spacing-normal0remLetter spacing--p-font-line-height-300.75remAa--p-font-line-height-4001remAa--p-font-line-height-5001.25remAa--p-font-line-height-6001.5remAa--p-font-line-height-7001.75remAa--p-font-line-height-8002remAa--p-font-line-height-10002.5remAa--p-font-line-height-12003remAa--p-font-line-height-body-large1.375remAa--p-font-line-height-body-medium1.25remAa--p-font-line-height-body-small1.125remAa--p-font-line-height-body-x-small.875remAa--p-font-line-height-button-label1remAa--p-font-line-height-details-text1remAa--p-font-line-height-display-large2.25remAa--p-font-line-height-display-medium2remAa--p-font-line-height-display-small1.75remAa--p-font-line-height-heading-large1.375remAa--p-font-line-height-heading-medium1.25remAa--p-font-line-height-heading-small1.125remAa--p-font-line-height-input-label1.25remAa--p-font-line-height-input-label-small1remAa--p-font-line-height-input-value1.25remAa--p-font-size-275.6875remAa--p-font-size-300.75remAa--p-font-size-325.8125remAa--p-font-size-350.875remAa--p-font-size-4001remAa--p-font-size-4501.125remAa--p-font-size-5001.25remAa--p-font-size-5501.375remAa--p-font-size-6001.5remAa--p-font-size-7501.875remAa--p-font-size-8002remAa--p-font-size-9002.25remAa--p-font-size-10002.5remAa--p-font-size-adjust-input-valuenoneAa--p-font-size-adjust-input-value-arabicnoneAa--p-font-size-adjust-input-value-hebrewnoneAa--p-font-size-avatar-initialsvar(--p-font-size-400)Aa--p-font-size-avatar-initials-longvar(--p-font-size-300)Aa--p-font-size-body-large.9375remAa--p-font-size-body-medium.8125remAa--p-font-size-body-small.75remAa--p-font-size-body-x-small.6875remAa--p-font-size-button-label.75remAa--p-font-size-details-text.75remAa--p-font-size-display-large1.8125remAa--p-font-size-display-medium1.625remAa--p-font-size-display-small1.375remAa--p-font-size-heading-large.9375remAa--p-font-size-heading-medium.8125remAa--p-font-size-heading-small.75remAa--p-font-size-input-label.8125remAa--p-font-size-input-label-small.75remAa--p-font-size-input-value.8125remAa--p-font-weight-bold600Aa--p-font-weight-button-labelvar(--p-font-weight-medium)Aa--p-font-weight-details-textvar(--p-font-weight-regular)Aa--p-font-weight-display-largevar(--p-font-weight-medium)Aa--p-font-weight-display-mediumvar(--p-font-weight-medium)Aa--p-font-weight-display-smallvar(--p-font-weight-medium)Aa--p-font-weight-heading-largevar(--p-font-weight-medium)Aa--p-font-weight-heading-mediumvar(--p-font-weight-medium)Aa--p-font-weight-heading-smallvar(--p-font-weight-medium)Aa--p-font-weight-input-labelvar(--p-font-weight-medium)Aa--p-font-weight-input-label-smallvar(--p-font-weight-regular)Aa--p-font-weight-medium500Aa--p-font-weight-regular400Aa--p-font-weight-semibold600Aa
शैडो
--p-shadow-0none--p-shadow-100मान दिखाएं
0rem .3125rem .3125rem -.15625rem rgba(0, 0, 0, .03), 0rem .1875rem .1875rem -.09375rem #00000005, 0rem .125rem .125rem -.0625rem #00000005, 0rem .0625rem .0625rem -.03125rem #00000008, 0rem .03125rem .03125rem 0rem #0000000a, 0rem 0rem 0rem .0625rem #0000000f--p-shadow-200मान दिखाएं
0rem .5rem .625rem -.3125rem rgba(0, 0, 0, .08), 0rem .3125rem .3125rem -.15625rem #00000008, 0rem .1875rem .1875rem -.09375rem #00000005, 0rem .125rem .125rem -.0625rem #00000005, 0rem .0625rem .0625rem -.03125rem #00000008, 0rem .03125rem .03125rem 0rem #0000000a, 0rem 0rem 0rem .0625rem #0000000f--p-shadow-300मान दिखाएं
0rem .5rem 1.5rem -.5rem #00000047, 0rem .5rem 1rem -.25rem #0000000d, 0rem .1875rem .375rem 0rem #0000000d, 0rem .125rem .25rem 0rem #0000000d, 0rem .0625rem .125rem 0rem #0000000d, 0rem 0rem 0rem .0625rem #0000000f--p-shadow-400मान दिखाएं
0rem 1.25rem 2rem -.75rem #00000033, 0rem .625rem 1rem -.375rem #00000014, 0rem .1875rem .375rem 0rem #00000014, 0rem .125rem .25rem 0rem #00000014, 0rem .0625rem .125rem 0rem #0000000d, 0rem 0rem 0rem .0625rem #0000000f--p-shadow-500मान दिखाएं
0rem 1.5rem 2.25rem -.75rem #0000001f, 0rem 1.5rem 1.5rem -.75rem #00000014, 0rem .5rem 1rem -.375rem #00000014, 0rem .1875rem .375rem 0rem #00000014, 0rem .125rem .25rem 0rem #00000014, 0rem .0625rem .125rem 0rem #0000000d, 0rem 0rem 0rem .0625rem #0000000f--p-shadow-600मान दिखाएं
0rem 1.5rem 3.5rem -.75rem #0000003d, 0rem 1.5rem 1.5rem -.75rem #0000001f, 0rem .1875rem .375rem 0rem #0000000d, 0rem .125rem .25rem 0rem #0000000d, 0rem .0625rem .125rem 0rem #0000000d, 0rem 0rem 0rem .0625rem #00000012--p-shadow-bannerमान दिखाएं
0rem 0rem .125rem 0rem #0000003d, 0rem .125rem .75rem 0rem #00000005, 0rem .25rem 1rem 0rem #00000005, 0rem .25rem 3rem 0rem #00000005--p-shadow-bevel-100मान दिखाएं
.0625rem 0rem 0rem 0rem #00000021 inset, -.0625rem 0rem 0rem 0rem #00000021 inset, 0rem -.0625rem 0rem 0rem #0000002b inset, 0rem .0625rem 0rem 0rem #cccccc80 inset--p-shadow-border-insetमान दिखाएं
0rem 0rem 0rem .0625rem #00000014 inset--p-shadow-buttonnone--p-shadow-button-disablednone--p-shadow-button-hoverमान दिखाएं
0rem .0625rem 0rem 0rem #ebebeb inset, -.0625rem 0rem 0rem 0rem #ebebeb inset, .0625rem 0rem 0rem 0rem #ebebeb inset, 0rem -.0625rem 0rem 0rem #ccc inset--p-shadow-button-insetमान दिखाएं
inset 0rem .125rem .375rem -.0625rem rgba(0, 0, 0, .07), inset 0rem .1875rem .125rem -.125rem #0000000d, inset 0rem .125rem .1875rem -.125rem #00000008, inset 0rem .0625rem .0625rem -.03125rem #0000000f, inset 0rem 0rem 0rem .03125rem #0000000d--p-shadow-button-primaryमान दिखाएं
0rem .0625rem .03125rem -.03125rem #00000021, 0rem .0625rem .125rem -.03125rem #00000021, 0rem .25rem .375rem -.125rem #00000021, 0rem .125rem .1875rem -.09375rem #00000021, inset 0rem 0rem .25rem .0625rem #101010, inset 0rem 0rem .25rem .125rem #ffffff1a, inset 0rem 0rem .75rem -.375rem #ffffffbf--p-shadow-button-primary-criticalमान दिखाएं
0rem .0625rem .03125rem -.03125rem rgba(229, 0, 0, .16), 0rem .0625rem .125rem -.03125rem #e5000029, 0rem .25rem .375rem -.125rem #e5000029, 0rem .125rem .1875rem -.09375rem #ff00001a, inset 0rem 0rem .25rem .0625rem #f50000, inset 0rem 0rem .25rem .125rem #ffffff1a, inset 0rem 0rem .75rem -.375rem #ffffffbf--p-shadow-button-primary-critical-hoverमान दिखाएं
0rem .0625rem .03125rem -.03125rem rgba(229, 0, 0, .12), 0rem .0625rem .125rem -.03125rem #e500001f, 0rem .25rem .375rem -.125rem #e500001f, 0rem .125rem .1875rem -.09375rem #ff00001f, inset 0rem 0rem .25rem .0625rem #f50000, inset 0rem 0rem .25rem .125rem #ffffff1a, inset 0rem 0rem .75rem -.375rem #ffffffbf--p-shadow-button-primary-critical-insetमान दिखाएं
0rem .0625rem .03125rem -.03125rem rgba(0, 0, 0, .13), inset 0rem 0rem .75rem -.375rem #ffffffbf, inset 0rem 0rem .25rem .125rem #ffffff1a, inset 0rem 0rem .25rem .0625rem #e0000b--p-shadow-button-primary-hoverमान दिखाएं
0rem .0625rem .03125rem -.03125rem #00000021, 0rem .0625rem .125rem -.03125rem #00000021, 0rem .25rem .375rem -.125rem #00000021, 0rem .125rem .1875rem -.09375rem #00000021, inset 0rem 0rem .25rem .0625rem #101010, inset 0rem 0rem .25rem .125rem #ffffff1a, inset 0rem 0rem .75rem -.375rem #ffffffbf--p-shadow-button-primary-insetमान दिखाएं
0rem .0625rem .03125rem -.03125rem #00000021, inset 0rem 0rem .75rem -.375rem #ffffffbf, inset 0rem 0rem .25rem .125rem #ffffff1a, inset 0rem 0rem .25rem .0625rem #101010--p-shadow-button-primary-successमान दिखाएं
0rem -.0625rem 0rem .0625rem #0c5132cc inset, 0rem 0rem 0rem .0625rem #136f45cc inset, 0rem .03125rem 0rem .09375rem #ffffff40 inset--p-shadow-button-primary-success-hoverमान दिखाएं
0rem .0625rem 0rem 0rem #ffffff7a inset, .0625rem 0rem 0rem 0rem #ffffff33 inset, -.0625rem 0rem 0rem 0rem #ffffff33 inset, 0rem -.09375rem 0rem 0rem #00000040 inset--p-shadow-button-primary-success-insetमान दिखाएं
-.0625rem 0rem .0625rem 0rem #00000033 inset, .0625rem 0rem .0625rem 0rem #00000033 inset, 0rem .125rem 0rem 0rem #00000099 inset--p-shadow-choice-checkedमान दिखाएं
0rem .0625rem .0625rem -.03125rem #00000021, inset 0rem 0rem 0rem .03125rem #00000066, inset 0rem .09375rem .125rem -.0625rem #ffffff6b--p-shadow-choice-critical-checkedमान दिखाएं
0rem .0625rem .0625rem -.03125rem #00000021, inset 0rem 0rem 0rem .03125rem #0000001a, inset 0rem .09375rem .125rem -.0625rem #ffffff6b--p-shadow-containerमान दिखाएं
0rem 0rem .125rem 0rem rgba(0, 0, 0, .24), 0rem .125rem .75rem 0rem #00000005, 0rem .25rem 1rem 0rem #00000005, 0rem .25rem 3rem 0rem #00000005--p-shadow-control-insetमान दिखाएं
inset 0rem 0rem 0rem .03125rem #00000005, 0rem 0rem 0rem .0625rem #ffffff8c, 0rem .0625rem 0rem 0rem #fff, 0rem 0rem .5rem 0rem #00000005, inset 0rem .0625rem .125rem 0rem #00000005--p-shadow-control-knobमान दिखाएं
0 .0625rem .0625rem -.03125rem #0000000f, 0 .125rem .125rem -.0625rem #0000000f, 0 .25rem .25rem -.125rem #0000000f, 0 .125rem .5rem 0 #0000000f--p-shadow-dialogमान दिखाएं
0rem .125rem .1875rem -.0625rem rgba(0, 0, 0, .06), 0rem .25rem .375rem -.125rem #0000000f, 0rem .5rem .75rem -.25rem #0000000f, 0rem 1rem 1.5rem -.375rem #0000000f, 0rem 2rem 3rem -.5rem #0000000f, 0rem 0rem 0rem .0625rem #00000014--p-shadow-inputमान दिखाएं
0rem .125rem .1875rem -.0625rem rgba(0, 0, 0, .04), 0rem .1875rem .25rem -.09375rem #0000000a, 0rem 0rem 0rem .0625rem #00000021--p-shadow-input-aiमान दिखाएं
0 0 .5rem .0625rem #7e5cff0d inset, 0 .125rem .1875rem -.0625rem #0000000a, 0 .1875rem .25rem -.09375rem #0000000a, 0 .25rem .3125rem -.125rem #0000000a, 0 0 0 .0625rem #7e5cff--p-shadow-input-ai-focusinitial--p-shadow-input-criticalमान दिखाएं
0rem 0rem 0rem .0625rem #eb0014, 0rem .25rem .3125rem -.125rem #0000000a, 0rem .1875rem .25rem -.09375rem #0000000a, 0rem .125rem .1875rem -.0625rem #0000000a, inset 0rem 0rem .5rem .0625rem #e03d500d--p-shadow-input-critical-focusमान दिखाएं
0 0 .5rem .0625rem rgba(255, 43, 58, .05) inset, 0 0 0 .1875rem #ff2b3a24, 0 0 0 .0625rem #ff2b3a, 0 .25rem .3125rem -.125rem #0000000a, 0 .1875rem .25rem -.09375rem #0000000a, 0 .125rem .1875rem -.0625rem #0000000a--p-shadow-input-disabledमान दिखाएं
0rem 0rem 0rem .0625rem rgba(0, 0, 0, .10)--p-shadow-input-errorमान दिखाएं
var(--p-shadow-input-critical)--p-shadow-input-error-focusमान दिखाएं
var(--p-shadow-input-critical-focus)--p-shadow-input-focusमान दिखाएं
0rem .125rem .1875rem -.0625rem rgba(0, 0, 0, .04), 0rem .1875rem .25rem -.09375rem #0000000a, 0rem .25rem .3125rem -.125rem #0000000a, 0rem 0rem 0rem .0625rem var(--p-color-border-focus), 0rem 0rem 0rem .1875rem #3573f60f, 0rem .25rem 1.25rem .125rem #3573f60f, inset 0rem 0rem .5rem .0625rem #3573f60d--p-shadow-input-strongमान दिखाएं
0rem .125rem .1875rem -.0625rem rgba(0, 0, 0, .04), 0rem .1875rem .25rem -.09375rem #0000000a, 0rem 0rem 0rem .0625rem #00000033--p-shadow-inset-100मान दिखाएं
0rem .0625rem .125rem 0rem #1a1a1a26 inset, 0rem .0625rem .0625rem 0rem #1a1a1a26 inset--p-shadow-inset-200मान दिखाएं
0rem .125rem .0625rem 0rem #1a1a1a33 inset, .0625rem 0rem .0625rem 0rem #1a1a1a1f inset, -.0625rem 0rem .0625rem 0rem #1a1a1a1f inset--p-shadow-item-focusमान दिखाएं
inset 0 0 0 .0625rem var(--p-color-border-focus), inset 0 0 .5rem .0625rem #5083f00d, inset 0 .25rem 1.25rem .125rem #5083f00f--p-shadow-nav-item-activeमान दिखाएं
inset 0rem 0rem .75rem rgba(255, 255, 255, .04), inset 0rem .0625rem .0625rem #ffffff0a, inset 0rem 0rem 0rem .0625rem #ffffff05--p-shadow-nav-selectedमान दिखाएं
0rem 0rem 0rem .0625rem rgba(255, 255, 255, .02) inset, 0rem .0625rem .0625rem 0rem #ffffff0f inset, 0rem 0rem .75rem .0625rem #ffffff0f inset, 0rem .0625rem .125rem 0rem #0000001a, 0rem 0rem 0rem .0625rem #0000001a--p-shadow-page-buttonमान दिखाएं
var(--p-shadow-toolbar-action)--p-shadow-page-button-activeमान दिखाएं
var(--p-shadow-toolbar-action-active)--p-shadow-popoverमान दिखाएं
0rem .125rem .125rem -.0625rem rgba(0, 0, 0, .06), 0rem .1875rem .25rem -.125rem #0000000f, 0rem .375rem .5rem -.1875rem #0000000f, 0rem .75rem 1rem -.25rem #0000000f, 0rem 0rem 0rem .0625rem #00000014--p-shadow-sectionमान दिखाएं
0rem 0rem .125rem 0rem rgba(0, 0, 0, .24), 0rem .125rem .75rem 0rem #00000005, 0rem .25rem 1rem 0rem #00000005, 0rem .25rem 3rem 0rem #00000005--p-shadow-toastमान दिखाएं
0rem .125rem .25rem -.0625rem #00000014, 0rem .25rem .5rem -.125rem #00000014, 0rem .5rem 1rem -.25rem #00000014, 0rem 1rem 2rem -.5rem #00000014, 0rem 2rem 4rem -1rem #00000014, 0rem 4rem 8rem -2rem #00000014, 0rem 0rem 0rem .0625rem #00000014--p-shadow-toolbar-actionमान दिखाएं
0 0 0 .0625rem rgba(0, 0, 0, .07), 0 .125rem 1.25rem 0 #00000008, 0 .3125rem 1.25rem 0 #00000008, 0 .5rem 3.75rem 0 #00000008--p-shadow-toolbar-action-activeमान दिखाएं
0 0 0 .0625rem rgba(0, 0, 0, .07), 0 .125rem 1.25rem 0 #00000008, 0 .3125rem 1.25rem 0 #00000008, 0 .5rem 3.75rem 0 #00000008
मोशन
--p-motion-duration-00ms--p-motion-duration-5050ms--p-motion-duration-100100ms--p-motion-duration-150150ms--p-motion-duration-200200ms--p-motion-duration-250250ms--p-motion-duration-300300ms--p-motion-duration-350350ms--p-motion-duration-400400ms--p-motion-duration-450450ms--p-motion-duration-500500ms--p-motion-duration-50005000ms--p-motion-easecubic-bezier(.25, .1, .25, 1)--p-motion-ease-incubic-bezier(.42, 0, 1, 1)--p-motion-ease-in-outcubic-bezier(.42, 0, .58, 1)--p-motion-ease-outcubic-bezier(.19, .91, .38, 1)--p-motion-ease-out-emphasizedcubic-bezier(.2, .8, 0, 1)--p-motion-keyframes-appear-abovep-motion-keyframes-appear-above--p-motion-keyframes-appear-belowp-motion-keyframes-appear-below--p-motion-keyframes-bouncep-motion-keyframes-bounce--p-motion-keyframes-fade-inp-motion-keyframes-fade-in--p-motion-keyframes-pulsep-motion-keyframes-pulse--p-motion-keyframes-spinp-motion-keyframes-spin--p-motion-linearcubic-bezier(0, 0, 1, 1)
Z-index
| वेरिएबल | मान | पूर्वावलोकन |
|---|---|---|
--p-z-index-0 | auto | |
--p-z-index-1 | 100 | |
--p-z-index-2 | 400 | |
--p-z-index-3 | 510 | |
--p-z-index-4 | 512 | |
--p-z-index-5 | 513 | |
--p-z-index-6 | 514 | |
--p-z-index-7 | 515 | |
--p-z-index-8 | 516 | |
--p-z-index-9 | 517 | |
--p-z-index-10 | 518 | |
--p-z-index-11 | 519 | |
--p-z-index-12 | 520 |
चौड़ाई
| वेरिएबल | मान | पूर्वावलोकन |
|---|---|---|
--p-width-0 | 0rem | |
--p-width-025 | .0625rem | |
--p-width-050 | .125rem | |
--p-width-100 | .25rem | |
--p-width-150 | .375rem | |
--p-width-200 | .5rem | |
--p-width-300 | .75rem | |
--p-width-400 | 1rem | |
--p-width-500 | 1.25rem | |
--p-width-600 | 1.5rem | |
--p-width-700 | 1.75rem | |
--p-width-800 | 2rem | |
--p-width-900 | 2.25rem | |
--p-width-1000 | 2.5rem | |
--p-width-1200 | 3rem | |
--p-width-1600 | 4rem | |
--p-width-2000 | 5rem | |
--p-width-2400 | 6rem | |
--p-width-2800 | 7rem | |
--p-width-3200 | 8rem |
ऊँचाई
| वेरिएबल | मान | पूर्वावलोकन |
|---|---|---|
--p-height-0 | 0rem | |
--p-height-025 | .0625rem | |
--p-height-050 | .125rem | |
--p-height-100 | .25rem | |
--p-height-150 | .375rem | |
--p-height-200 | .5rem | |
--p-height-300 | .75rem | |
--p-height-400 | 1rem | |
--p-height-500 | 1.25rem | |
--p-height-600 | 1.5rem | |
--p-height-700 | 1.75rem | |
--p-height-800 | 2rem | |
--p-height-900 | 2.25rem | |
--p-height-1000 | 2.5rem | |
--p-height-1200 | 3rem | |
--p-height-1600 | 4rem | |
--p-height-2000 | 5rem | |
--p-height-2400 | 6rem | |
--p-height-2800 | 7rem | |
--p-height-3200 | 8rem | |
--p-height-field-min-block-size | 1.875rem |
ब्रेकपॉइंट
Breakpoint variables में widths होती हैं, लेकिन CSS किसी media query के अंदर var() इस्तेमाल नहीं कर सकता, इसलिए value सीधे लिखें: @media (min-width: 48rem)।
| वेरिएबल | मान | पूर्वावलोकन |
|---|---|---|
--p-breakpoints-lg | 65rem | |
--p-breakpoints-md | 48rem | |
--p-breakpoints-sm | 30.625rem | |
--p-breakpoints-xl | 90rem | |
--p-breakpoints-xs | 0rem |
अन्य
| वेरिएबल | मान | पूर्वावलोकन |
|---|---|---|
--p-filter-nav-icon | saturate(0) invert(1) brightness(1.5) contrast(1.5) opacity(.9) | |
--p-filter-nav-icon-active | saturate(0) invert(1) brightness(2) contrast(1.5) opacity(.9) |