@amsterdam/design-system-tokens/dist/compact.theme.css

All design tokens from the Amsterdam Design System. Use it to apply its visual design to your website or application.

/**
 * Do not edit directly, this file was auto-generated.
 */

.ams-theme--compact {
  --ams-space-xs: clamp(0.1875rem, 0.1719rem + 0.0781vw, 0.25rem);
  --ams-space-s: clamp(0.375rem, 0.3438rem + 0.1563vw, 0.5rem);
  --ams-space-m: clamp(0.75rem, 0.6875rem + 0.3125vw, 1rem);
  --ams-space-l: clamp(1rem, 0.875rem + 0.625vw, 1.5rem);
  --ams-space-xl: clamp(1.25rem, 1rem + 1.25vw, 2.25rem);
  --ams-space-2xl: clamp(1.5rem, 1.125rem + 1.875vw, 3rem);
  --ams-typography-body-text-font-size: 1rem;
  --ams-typography-body-text-small-font-size: clamp(0.8889rem, calc(0.9141rem + -0.0253vw), 0.9091rem);
  --ams-typography-body-text-large-font-size: clamp(1.1rem, calc(1.0938rem + 0.0313vw), 1.125rem);
  --ams-typography-body-text-x-large-font-size: clamp(1.21rem, calc(1.1961rem + 0.0695vw), 1.2656rem);
  --ams-typography-heading-0-font-size: clamp(1.6105rem, calc(1.5626rem + 0.2394vw), 1.802rem);
  --ams-typography-heading-1-font-size: clamp(1.4641rem, calc(1.4297rem + 0.1721vw), 1.6018rem);
  --ams-typography-heading-2-font-size: clamp(1.331rem, calc(1.3078rem + 0.116vw), 1.4238rem);
  --ams-typography-heading-3-font-size: clamp(1.21rem, calc(1.1961rem + 0.0695vw), 1.2656rem);
  --ams-typography-heading-4-font-size: clamp(1.1rem, calc(1.0938rem + 0.0313vw), 1.125rem);
  --ams-typography-heading-5-font-size: 1rem;
  --ams-typography-heading-6-font-size: clamp(0.8889rem, calc(0.9141rem + -0.0253vw), 0.9091rem);
  --ams-grid-padding-inline: var(--ams-space-xl);
}