.webp)
Context.dev
One API to scrape, enrich, and understand the web
No items found.
Visual identity
Context.dev — design reference
Source: https://www.context.dev/. Extracted 2026-10-14. Scope: public marketing website CSS; declared styles, not computed browser values. This is an observed inventory, not an official internal design system.
Typography
font-family: var(--font-sans)— selector.web-data-preview-module**NOfKza**containerfont-family: var(--font-display)— selectorh1,h2,h3,h4,h5,h6font-family: var(--font-mono)— selectorcode,pre,kbd,sampfont-family: var(--font-mono)!important— selector.[&_pre_code]:font-mono! pre codefont-size: var(--text-4xl)— selector.prose h1font-size: var(--text-3xl)— selector.prose h2font-size: var(--text-2xl)— selector.prose h3font-size: var(--text-xl)— selector.prose h4font-size: var(--text-lg)— selector.prose h5font-size: var(--text-base)— selector.prose h6font-weight: 500— selector.web-data-preview-module**NOfKza**codeHeadingfont-weight: var(--font-weight-semibold)— selector.prose h1font-weight: var(--font-weight-medium)— selector.prose aline-height: var(--tw-leading,var(--text-4xl--line-height))— selector.prose h1line-height: 1.2— selector.prose h1line-height: var(--tw-leading,var(--text-3xl--line-height))— selector.prose h2line-height: 1.3— selector.prose h2line-height: var(--tw-leading,var(--text-2xl--line-height))— selector.prose h3line-height: 1.4— selector.prose h3line-height: var(--tw-leading,var(--text-xl--line-height))— selector.prose h4line-height: var(--tw-leading,var(--text-lg--line-height))— selector.prose h5letter-spacing: -.09375rem— selector.prose h1letter-spacing: -.0625rem— selector.prose h2letter-spacing: -.03125rem— selector.prose h3letter-spacing: -.01875rem— selector.prose h4letter-spacing: .08em— selector.[&_[cmdk-group-heading]]:tracking-[0.08em] [cmdk-group-heading]letter-spacing: -.007em— selector.[&_h1]:tracking-[-0.007em] h1
Colors and surfaces
color: #111827— selector.web-data-preview-module**NOfKza**containercolor: #5c418b— selector.web-data-preview-module**NOfKza**codeHeadingcolor: hsl(var(--foreground))— selectorbodycolor: #000— selector.prose h1,.prose h2,.prose h3,.prose h4,.prose h5,.prose h6color: #000000bf— selector.prose pcolor: #2563eb— selector.prose acolor: #0009— selector.prose blockquote pbackground-color: #0000— selectorbutton,input,select,optgroup,textareabackground-color: hsl(var(--background))— selectorbodybackground-color: #f5f5f5— selector.prose prebackground-color: #2563eb— selector.prose a:afterbackground-color: var(--color-brand-button)— selector.bg-brand-buttonbackground-color: hsl(var(--card))— selector.bg-cardbackground-color: hsl(var(--card))!important— selector.dark:!bg-card:is(.dark .theme-aware,.dark .theme-aware _)background-color: color-mix(in oklab, hsl(var(--card)) 80%, transparent)— selector.dark:bg-card/80:is(.dark .theme-aware,.dark .theme-aware _)
Components and layout
border-radius: 23px— selector.web-data-preview-module**NOfKza**cardborder-radius: 0— selectorbutton,input,select,optgroup,textareaborder-radius: var(--radius-brand-card,.875rem)— selector.brand-card-surfaceborder-radius: var(--radius-lg)— selector.prose preborder-radius: .5rem .5rem 0 0— selector.prose pre:beforeborder-radius: 0!important— selector.[&_pre]:!rounded-none prebox-shadow: 0 6px 24px #4d2b7b1f— selector.web-data-preview-module**NOfKza**cardbox-shadow: var(--brand-card-shadow)— selector.brand-card-surfacebox-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)— selector.shadow-brand-cardbox-shadow: none!important— selector.marketing-shell:has([data-product-page]:not([style="display: none"],[style="display: none"] :where([data-product-page]))) #marketing-products-trigger[aria-expanded=false]max-width: 36rem!important— selector.!containermax-width: 43.2rem!important— selector.!containermax-width: 57.6rem!important— selector.!containermax-width: 72rem!important— selector.!containermax-width: 86.4rem!important— selector.!containermax-width: 36rem— selector.containermax-width: 43.2rem— selector.containermax-width: 57.6rem— selector.containerpadding: 28px— selector.web-data-preview-module**NOfKza**cardpadding: 16px— selector.web-data-preview-module**NOfKza**cardpadding: 0— selector::file-selector-buttonpadding: calc(var(--spacing) 6)— selector.prose prepadding: calc(var(--spacing) 4)— selector.prose prepadding: calc(var(--spacing) 2)!important— selector.data-[slot=sidebar-menu-button]:!p-2[data-slot=sidebar-menu-button]padding: calc(var(--spacing) 3)— selector.[&_pre]:p-3 pregap: var(--hero-badge-gap,.75rem)— selector.gap-[var(--hero-badge-gap,0.75rem)]gap: var(--hero-layout-gap,1.75rem)— selector.gap-[var(--hero-layout-gap,1.75rem)]gap: var(--hero-title-gap,.75rem)— selector.gap-[var(--hero-title-gap,0.75rem)]gap: var(--hero-layout-gap,2rem)— selector.lg:gap-[var(--hero-layout-gap,2rem)]gap: 13px— selector.marketing-shell:has([data-product-page]:not([style_="display: none"],[style_="display: none"] :where([data-product-page]))) [data-footer-socials]gap: 11px— selector.marketing-shell:has([data-product-page]:not([style_="display: none"],[style_="display: none"] :where([data-product-page]))) nav[aria-label=Footer]>divgap: 8px— selector.marketing-shell:has([data-product-page]:not([style_="display: none"],[style_="display: none"] :where([data-product-page]))) nav[aria-label=Footer] ultransition: opacity .8s— selector.hero-background-module**KaxF4q**watertransition: none— selector.hero-background-module**KaxF4q**watertransition: all .2s ease-in-out— selector.prose atransition: width .2s ease-in-out— selector.prose a:aftertransition: block-size .2s ease-out, content-visibility .2s allow-discrete— selectordetails.faq-card::details-content
Responsive rules
(hover:hover)
(max-width:47.99rem)
(prefers-reduced-motion:reduce),(max-width:47.99rem),(pointer:coarse) and (max-height:47.99rem)
(min-width:43.2rem)
(min-width:57.6rem)
(max-width:43.2rem)
(min-width:36rem)
(min-width:72rem)
(min-width:86.4rem)
(min-width:78.75rem)
(forced-colors:active)
(prefers-reduced-motion:no-preference)
(prefers-reduced-motion:reduce)
not all and (min-width:57.6rem)
not all and (min-width:43.2rem)
not all and (min-width:36rem)
(min-width:420px)
(min-width:880px)
(min-width:1200px)
(min-width:1280px)
(min-width:1360px)
(min-width:64rem)
(min-width:90rem)
(pointer:coarse)
(max-width:35.999rem)Source: https://www.context.dev/. Extracted 2026-10-14. Scope: public marketing website CSS; declared styles, not computed browser values. This is an observed inventory, not an official internal design system.
Original CSS custom-property declarations, grouped by source and selector. Up to 250 declarations; selectors preserved; media-query conditions are not attached to individual declarations.
https://www.context.dev/ — :root:root,:host,.c15t-theme-root.c15t-theme-root
--c15t-border: #e4e4e7;
--c15t-border-hover: #d4d4d8;
--c15t-font-family: var(--font-plex-sans), system-ui, sans-serif;
--c15t-font-size-base: 0.875rem;
--c15t-font-size-lg: 1rem;
--c15t-font-size-sm: 0.8125rem;
--c15t-font-weight-medium: 500;
--c15t-font-weight-normal: 400;
--c15t-font-weight-semibold: 500;
--c15t-line-height-normal: 1.5;
--c15t-line-height-relaxed: 1.7;
--c15t-line-height-tight: 1.3;
--c15t-primary: #18181b;
--c15t-primary-hover: #27272a;
--c15t-radius-full: 9999px;
--c15t-radius-lg: 0.5rem;
--c15t-radius-md: 0.375rem;
--c15t-radius-sm: 0.25rem;
--c15t-shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.08);
--c15t-shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
--c15t-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
--c15t-surface: #ffffff;
--c15t-surface-hover: #fafafa;
--c15t-switch-thumb: #ffffff;
--c15t-switch-track: #d4d4d8;
--c15t-switch-track-active: #18181b;
--c15t-text: #18181b;
--c15t-text-muted: #71717a;
--c15t-text-on-primary: #ffffff;https://www.context.dev/ — :root:root.dark,:host(.dark),.dark .c15t-theme-root.c15t-theme-root,:root:root.c15t-dark,:host(.c15t-dark),.c15t-dark .c15t-theme-root.c15t-theme-root
--c15t-border: #27272a;
--c15t-border-hover: #3f3f46;
--c15t-font-family: var(--font-plex-sans), system-ui, sans-serif;
--c15t-font-size-base: 0.875rem;
--c15t-font-size-lg: 1rem;
--c15t-font-size-sm: 0.8125rem;
--c15t-font-weight-medium: 500;
--c15t-font-weight-normal: 400;
--c15t-font-weight-semibold: 500;
--c15t-line-height-normal: 1.5;
--c15t-line-height-relaxed: 1.7;
--c15t-line-height-tight: 1.3;
--c15t-primary: #fafafa;
--c15t-primary-hover: #e4e4e7;
--c15t-radius-full: 9999px;
--c15t-radius-lg: 0.5rem;
--c15t-radius-md: 0.375rem;
--c15t-radius-sm: 0.25rem;
--c15t-shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.08);
--c15t-shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
--c15t-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
--c15t-surface: #0a0a0a;
--c15t-surface-hover: #171717;
--c15t-switch-thumb: #ffffff;
--c15t-switch-track: #d4d4d8;
--c15t-switch-track-active: #18181b;
--c15t-text: #fafafa;
--c15t-text-muted: #a1a1aa;
--c15t-text-on-primary: #09090b;https://www.context.dev/_next/static/immutable/chunks/0ue2x55w2flaq.css — .marketing-header-frame-module**xOV7Ra**header
--header-side-inset: 0px;https://www.context.dev/_next/static/immutable/chunks/3n4iut7uix-x-.css — .ibm_plex_sans_a7ae6fef-module**cy8ZWG**variable
--font-plex-sans: "IBM Plex Sans", "IBM Plex Sans Fallback";https://www.context.dev/_next/static/immutable/chunks/3n4iut7uix-x-.css — .ibm_plex_mono_5963912a-module**Ltib8q**variable
--font-plex-mono: "IBM Plex Mono", "IBM Plex Mono Fallback";https://www.context.dev/_next/static/immutable/chunks/0dw768e-wgzzt.css — :root,:host
--font-sans: var(--font-plex-sans), system-ui, sans-serif;
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
--font-mono: var(--font-plex-mono), ui-monospace, monospace;
--color-red-50: #fef2f2;
--color-red-100: #ffe2e2;
--color-red-200: #ffcaca;
--color-red-300: #ffa3a3;
--color-red-400: #ff6568;
--color-red-500: #fb2c36;
--color-red-600: #e40014;
--color-red-700: #bf000f;
--color-red-800: #9f0712;
--color-red-900: #82181a;
--color-orange-50: #fff7ed;
--color-orange-300: #ffb96d;
--color-orange-400: #ff8b1a;
--color-orange-500: #fe6e00;
--color-orange-600: #f05100;
--color-orange-800: #9f2d00;
--color-orange-900: #7e2a0c;
--color-amber-50: #fffbeb;
--color-amber-100: #fef3c6;
--color-amber-200: #fee685;
--color-amber-400: #fcbb00;
--color-amber-500: #f99c00;
--color-amber-600: #dd7400;
--color-amber-700: #b75000;
--color-amber-800: #953d00;
--color-amber-900: #7b3306;
--color-amber-950: #461901;
--color-yellow-50: #fefce8;
--color-yellow-100: #fef9c2;
--color-yellow-200: #fff085;
--color-yellow-400: #fac800;
--color-yellow-500: #edb200;
--color-yellow-600: #cd8900;
--color-yellow-800: #874b00;
--color-yellow-900: #733e0a;
--color-green-50: #f0fdf4;
--color-green-100: #dcfce7;
--color-green-200: #b9f8cf;
--color-green-300: #7bf1a8;
--color-green-400: #05df72;
--color-green-500: #00c758;
--color-green-600: #00a544;
--color-green-700: #008138;
--color-green-800: #016630;
--color-emerald-50: #ecfdf5;
--color-emerald-100: #d0fae5;
--color-emerald-200: #a4f4cf;
--color-emerald-400: #00d294;
--color-emerald-500: #00bb7f;
--color-emerald-600: #009767;
--color-emerald-700: #007956;
--color-emerald-800: #005f46;
--color-emerald-900: #004e3b;
--color-teal-500: #00baa7;
--color-cyan-400: #00d2ef;
--color-cyan-500: #00b7d7;
--color-cyan-600: #0092b5;
--color-blue-50: #eff6ff;
--color-blue-100: #dbeafe;
--color-blue-200: #bedbff;
--color-blue-300: #90c5ff;
--color-blue-400: #54a2ff;
--color-blue-500: #3080ff;
--color-blue-600: #155dfc;
--color-blue-700: #1447e6;
--color-violet-50: #f5f3ff;
--color-violet-100: #ede9fe;
--color-violet-200: #ddd6ff;
--color-violet-400: #a685ff;
--color-violet-500: #8d54ff;
--color-violet-600: #7f22fe;
--color-violet-700: #7008e7;
--color-violet-900: #4d179a;
--color-purple-50: #faf5ff;
--color-purple-200: #e9d5ff;
--color-purple-400: #c07eff;
--color-purple-500: #ac4bff;
--color-purple-600: #9810fa;
--color-purple-700: #8200da;
--color-pink-500: #f6339a;
--color-rose-50: #fff1f2;
--color-rose-200: #ffccd3;
--color-rose-400: #ff667f;
--color-rose-500: #ff2357;
--color-rose-600: #e70044;
--color-rose-700: #c20039;
--color-slate-50: #f8fafc;
--color-slate-100: #f1f5f9;
--color-slate-200: #e2e8f0;
--color-slate-400: #90a1b9;
--color-slate-500: #62748e;
--color-slate-600: #45556c;
--color-gray-50: #f9fafb;
--color-gray-100: #f3f4f6;
--color-gray-200: #e5e7eb;
--color-gray-300: #d1d5dc;
--color-gray-400: #99a1af;
--color-gray-500: #6a7282;
--color-gray-600: #4a5565;
--color-gray-700: #364153;
--color-gray-800: #1e2939;
--color-gray-900: #101828;
--color-gray-950: #030712;
--color-zinc-200: #e4e4e7;
--color-zinc-300: #d4d4d8;
--color-zinc-400: #9f9fa9;
--color-zinc-500: #71717b;
--color-zinc-600: #52525c;
--color-zinc-700: #3f3f46;
--color-zinc-800: #27272a;
--color-zinc-900: #18181b;
--color-neutral-50: #fafafa;
--color-neutral-100: #f5f5f5;
--color-neutral-300: #d4d4d4;
--color-neutral-400: #a1a1a1;
--color-neutral-500: #737373;
--color-neutral-600: #525252;
--color-neutral-700: #404040;
--color-neutral-900: #171717;
--color-neutral-950: #0a0a0a;
--color-black: #000;
--color-white: #fff;
--spacing: .25rem;
--container-xs: 20rem;
--container-sm: 24rem;
--container-md: 28rem;
--container-lg: 32rem;
--container-xl: 36rem;
--container-2xl: 42rem;
--container-3xl: 48rem;
--container-4xl: 56rem;
--container-5xl: 64rem;
--container-6xl: 72rem;
--container-7xl: 80rem;
--text-xs: .75rem;
--text-xs--line-height: calc(1 / .75);
--text-sm: .875rem;
--text-sm--line-height: calc(1.25 / .875);
--text-base: 1rem;
--text-base--line-height: calc(1.5 / 1);
--text-lg: 1.125rem;
--text-lg--line-height: calc(1.75 / 1.125);
--text-xl: 1.25rem;
--text-xl--line-height: calc(1.75 / 1.25);
--text-2xl: 1.5rem;
--text-2xl--line-height: calc(2 / 1.5);
--text-3xl: 1.875rem;
--text-3xl--line-height: calc(2.25 / 1.875);
--text-4xl: 2.25rem;
--text-4xl--line-height: calc(2.5 / 2.25);
--text-5xl: 3rem;
--text-5xl--line-height: 1;
--text-6xl: 3.75rem;
--text-6xl--line-height: 1;
--font-weight-light: 300;
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--font-weight-extrabold: 800;
--tracking-tighter: -.05em;
--tracking-tight: -.025em;
--tracking-normal: 0em;
--tracking-wide: .025em;
--tracking-wider: .05em;
--tracking-widest: .1em;
--leading-tight: 1.25;
--leading-snug: 1.375;
--leading-normal: 1.5;
--leading-relaxed: 1.625;
--radius-xs: .125rem;
--radius-sm: calc(var(--radius) - .25rem);
--radius-md: calc(var(--radius) - .125rem);
--radius-lg: var(--radius);
--radius-xl: .75rem;
--radius-2xl: 1rem;
--radius-3xl: 1.5rem;
--shadow-sm: 0 .0625rem .1875rem 0 #0000001a, 0 .0625rem .125rem -.0625rem #0000001a;
--shadow-md: 0 .25rem .375rem -.0625rem #0000001a, 0 .125rem .25rem -.125rem #0000001a;
--shadow-lg: 0 .625rem .9375rem -.1875rem #0000001a, 0 .25rem .375rem -.25rem #0000001a;
--ease-out: cubic-bezier(0, 0, .2, 1);
--ease-in-out: cubic-bezier(.4, 0, .2, 1);
--animate-spin: spin 1s linear infinite;
--animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite;
--animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
--blur-sm: .5rem;Source: https://www.context.dev/. Extracted 2026-10-14. Scope: public marketing website CSS; declared styles, not computed browser values. This is an observed inventory, not an official internal design system.
Observed design values, with source selectors. Names shown are CSS properties, not invented official token names.
| Property | Declared value | Selector |
|---|---|---|
| font-family | var(--font-sans) | .web-data-preview-module**NOfKza**container |
| font-family | var(--font-display) | h1,h2,h3,h4,h5,h6 |
| font-family | var(--font-mono) | code,pre,kbd,samp |
| font-family | var(--font-mono)!important | .[&_pre_code]:font-mono! pre code |
| font-size | var(--text-4xl) | .prose h1 |
| font-size | var(--text-3xl) | .prose h2 |
| font-size | var(--text-2xl) | .prose h3 |
| font-size | var(--text-xl) | .prose h4 |
| font-size | var(--text-lg) | .prose h5 |
| font-size | var(--text-base) | .prose h6 |
| font-weight | 500 | .web-data-preview-module**NOfKza**codeHeading |
| font-weight | var(--font-weight-semibold) | .prose h1 |
| font-weight | var(--font-weight-medium) | .prose a |
| line-height | var(--tw-leading,var(--text-4xl--line-height)) | .prose h1 |
| line-height | 1.2 | .prose h1 |
| line-height | var(--tw-leading,var(--text-3xl--line-height)) | .prose h2 |
| line-height | 1.3 | .prose h2 |
| line-height | var(--tw-leading,var(--text-2xl--line-height)) | .prose h3 |
| line-height | 1.4 | .prose h3 |
| line-height | var(--tw-leading,var(--text-xl--line-height)) | .prose h4 |
| line-height | var(--tw-leading,var(--text-lg--line-height)) | .prose h5 |
| letter-spacing | -.09375rem | .prose h1 |
| letter-spacing | -.0625rem | .prose h2 |
| letter-spacing | -.03125rem | .prose h3 |
| letter-spacing | -.01875rem | .prose h4 |
| letter-spacing | .08em | .[&_[cmdk-group-heading]]:tracking-[0.08em] [cmdk-group-heading] |
| letter-spacing | -.007em | .[&_h1]:tracking-[-0.007em] h1 |
| color | #111827 | .web-data-preview-module**NOfKza**container |
| color | #5c418b | .web-data-preview-module**NOfKza**codeHeading |
| color | hsl(var(--foreground)) | body |
| color | #000 | .prose h1,.prose h2,.prose h3,.prose h4,.prose h5,.prose h6 |
| color | #000000bf | .prose p |
| color | #2563eb | .prose a |
| color | #0009 | .prose blockquote p |
| background-color | #0000 | button,input,select,optgroup,textarea |
| background-color | hsl(var(--background)) | body |
| background-color | #f5f5f5 | .prose pre |
| background-color | #2563eb | .prose a:after |
| background-color | var(--color-brand-button) | .bg-brand-button |
| background-color | hsl(var(--card)) | .bg-card |
| background-color | hsl(var(--card))!important | .dark:!bg-card:is(.dark .theme-aware,.dark .theme-aware _) |
| background-color | color-mix(in oklab, hsl(var(--card)) 80%, transparent) | .dark:bg-card/80:is(.dark .theme-aware,.dark .theme-aware _) |
| border-radius | 23px | .web-data-preview-module**NOfKza**card |
| border-radius | 0 | button,input,select,optgroup,textarea |
| border-radius | var(--radius-brand-card,.875rem) | .brand-card-surface |
| border-radius | var(--radius-lg) | .prose pre |
| border-radius | .5rem .5rem 0 0 | .prose pre:before |
| border-radius | 0!important | .[&_pre]:!rounded-none pre |
| box-shadow | 0 6px 24px #4d2b7b1f | .web-data-preview-module**NOfKza**card |
| box-shadow | var(--brand-card-shadow) | .brand-card-surface |
| box-shadow | var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) | .shadow-brand-card |
| box-shadow | none!important | .marketing-shell:has([data-product-page]:not([style="display: none"],[style="display: none"] :where([data-product-page]))) #marketing-products-trigger[aria-expanded=false] |
| max-width | 36rem!important | .!container |
| max-width | 43.2rem!important | .!container |
| max-width | 57.6rem!important | .!container |
| max-width | 72rem!important | .!container |
| max-width | 86.4rem!important | .!container |
| max-width | 36rem | .container |
| max-width | 43.2rem | .container |
| max-width | 57.6rem | .container |
| padding | 28px | .web-data-preview-module**NOfKza**card |
| padding | 16px | .web-data-preview-module**NOfKza**card |
| padding | 0 | ::file-selector-button |
| padding | calc(var(--spacing) 6) | .prose pre |
| padding | calc(var(--spacing) 4) | .prose pre |
| padding | calc(var(--spacing) 2)!important | .data-[slot=sidebar-menu-button]:!p-2[data-slot=sidebar-menu-button] |
| padding | calc(var(--spacing) 3) | .[&_pre]:p-3 pre |
| gap | var(--hero-badge-gap,.75rem) | .gap-[var(--hero-badge-gap,0.75rem)] |
| gap | var(--hero-layout-gap,1.75rem) | .gap-[var(--hero-layout-gap,1.75rem)] |
| gap | var(--hero-title-gap,.75rem) | .gap-[var(--hero-title-gap,0.75rem)] |
| gap | var(--hero-layout-gap,2rem) | .lg:gap-[var(--hero-layout-gap,2rem)] |
| gap | 13px | .marketing-shell:has([data-product-page]:not([style_="display: none"],[style_="display: none"] :where([data-product-page]))) [data-footer-socials] |
| gap | 11px | .marketing-shell:has([data-product-page]:not([style_="display: none"],[style_="display: none"] :where([data-product-page]))) nav[aria-label=Footer]>div |
| gap | 8px | .marketing-shell:has([data-product-page]:not([style_="display: none"],[style_="display: none"] :where([data-product-page]))) nav[aria-label=Footer] ul |
| transition | opacity .8s | .hero-background-module**KaxF4q**water |
| transition | none | .hero-background-module**KaxF4q**water |
| transition | all .2s ease-in-out | .prose a |
| transition | width .2s ease-in-out | .prose a:after |
| transition | block-size .2s ease-out, content-visibility .2s allow-discrete | details.faq-card::details-content |
Source: https://www.context.dev/. Extracted 2026-10-14. Scope: public marketing website CSS; declared styles, not computed browser values. This is an observed inventory, not an official internal design system.
Evidence and limitations
- Values come directly from downloaded stylesheets. Selector context is retained to distinguish elements; individual media-query conditions are not retained.
- CSS cascade, active viewport, runtime styles, interactive states and private product UI were not verified. Colors or dimensions in utility classes may be unused on this page.
- No inferred dark theme, semantic color roles or framework defaults have been added.
- 586 custom-property declarations found; 2947 relevant property declarations parsed.
Stylesheet sources
- https://www.context.dev/
- https://www.context.dev/_next/static/immutable/chunks/0ue2x55w2flaq.css
- https://www.context.dev/_next/static/immutable/chunks/3ub-47h71v5-1.css
- https://www.context.dev/_next/static/immutable/chunks/3n4iut7uix-x-.css
- https://www.context.dev/_next/static/immutable/chunks/0dw768e-wgzzt.css