@primer/react-brand/lib/design-tokens/css/tokens/functional/typography/typography.css

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

/**
 * Do not edit directly
 * Generated on Fri, 01 Aug 2025 13:48:37 GMT
 */

:root {
  --brand-text-style-italic-10: 'ital' 10;
  --brand-text-style-italic-9: 'ital' 9;
  --brand-text-style-italic-8: 'ital' 8;
  --brand-text-style-italic-7: 'ital' 7;
  --brand-text-style-italic-6: 'ital' 6;
  --brand-text-style-italic-5: 'ital' 5;
  --brand-text-style-italic-4: 'ital' 4;
  --brand-text-style-italic-3: 'ital' 3;
  --brand-text-style-italic-2: 'ital' 2;
  --brand-text-style-italic-1: 'ital' 1;
  --brand-text-letterSpacing-1000: -0.03em;
  --brand-text-letterSpacing-900: -0.02em;
  --brand-text-letterSpacing-800: -0.02em;
  --brand-text-letterSpacing-700: -0.02em;
  --brand-text-letterSpacing-600: -0.02em;
  --brand-text-letterSpacing-500: -0.01em;
  --brand-text-letterSpacing-400: -0.01em;
  --brand-text-lineHeight-1000: 1.1;
  --brand-text-lineHeight-900: 1.1;
  --brand-text-lineHeight-800: 1.2;
  --brand-text-lineHeight-700: 1.2;
  --brand-text-lineHeight-600: 1.2;
  --brand-text-lineHeight-500: 1.3;
  --brand-text-lineHeight-400: 1.3;
  --brand-text-lineHeight-350: 1.3;
  --brand-text-lineHeight-300: 1.5;
  --brand-text-lineHeight-200: 1.5;
  --brand-text-lineHeight-100: 1.5;
  --brand-text-size-1000: 2.5rem;
  --brand-text-size-900: 2.25rem;
  --brand-text-size-800: 2rem;
  --brand-text-size-700: 1.75rem;
  --brand-text-size-600: 1.5rem;
  --brand-text-size-500: 1.375rem;
  --brand-text-size-400: 1.25rem;
  --brand-text-size-350: 1.125rem;
  --brand-text-size-300: 1.125rem;
  --brand-text-size-200: 1rem;
  --brand-text-size-100: 0.875rem;
  --brand-text-weight-1000: var(--base-text-weight-bold);
  --brand-text-weight-900: var(--base-text-weight-semibold);
  --brand-text-weight-800: var(--base-text-weight-semibold);
  --brand-text-weight-700: var(--base-text-weight-semibold);
  --brand-text-weight-600: var(--base-text-weight-semibold);
  --brand-text-weight-500: var(--base-text-weight-semibold);
  --brand-text-weight-400: var(--base-text-weight-semibold);
  --brand-text-weight-350: var(--base-text-weight-semibold);
  --brand-text-weight-300: var(--base-text-weight-normal);
  --brand-text-weight-200: var(--base-text-weight-normal);
  --brand-text-weight-100: var(--base-text-weight-normal);
  --brand-heading-letterSpacing-700: -0.02em;
  --brand-heading-letterSpacing-600: -0.02em;
  --brand-heading-letterSpacing-500: -0.01em;
  --brand-heading-letterSpacing-400: -0.01em;
  --brand-heading-weight-700: var(--base-text-weight-semibold);
  --brand-heading-weight-600: var(--base-text-weight-semibold);
  --brand-heading-weight-500: var(--base-text-weight-semibold);
  --brand-heading-weight-400: var(--base-text-weight-semibold);
  --brand-fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
  --brand-fontStack-sansSerifAlt: 'Hubot Sans',-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
  --brand-fontStack-sansSerif: 'Mona Sans', 'MonaSansFallback',-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
  --brand-fontStack-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
  --brand-heading-fontFamily: var(--brand-fontStack-sansSerif);
  --brand-body-fontFamily: var(--brand-fontStack-sansSerif);
}