root
e27bf78487
Add the official Scirium wordmark production assets and the shared design-token source of truth extracted from the converged landing page. - Production logo assets (14 files): outlined Fraunces wordmark in color, mono, and reversed SVG; print PNGs at 2700x1000; email-signature PNGs at 270x100; full favicon set (SVG, ICO, 16/32/48/512, apple-touch-icon). - design-tokens.json (v1.0.0) and design-tokens.css: brand primitives, 20 color tokens per theme, font stacks, shadows, radius and type scale, breakpoints. - Wordmark integrates theme-adaptive on the live page: ink via currentColor, dot via --highlight, underline via --accent (verified light and dark).
69 lines
2.0 KiB
CSS
69 lines
2.0 KiB
CSS
/* Scirium design tokens v1.0.0 — single source of truth
|
|
Extracted from the converged landing page (mockups.itpropartner.com/scirium)
|
|
on 2026-08-16. Consumers: landing page, admin console, Rocket.Chat theme.
|
|
Edit here, then re-import into each surface. Do not fork colors per surface. */
|
|
|
|
:root{
|
|
--bg:#f5f3ee;
|
|
--bg-2:#eeebe4;
|
|
--surface:#fdfbf7;
|
|
--ink:#17150f;
|
|
--ink-soft:#3f3a31;
|
|
--muted:#6c665c;
|
|
--faint:#97917f;
|
|
--line:#e2dccd;
|
|
--line-strong:#cfc7b4;
|
|
--accent:#0d7a6a;
|
|
--accent-ink:#0a5f53;
|
|
--accent-soft:rgba(13,122,106,0.09);
|
|
--highlight:#f0c14f;
|
|
--highlight-soft:rgba(240,193,79,0.32);
|
|
--glow:rgba(13,122,106,0.16);
|
|
--grain-opacity:0.035;
|
|
--nav-bg:rgba(245,243,238,0.82);
|
|
--shadow:0 1px 2px rgba(23,21,15,0.05),0 12px 40px rgba(23,21,15,0.07);
|
|
--shadow-lg:0 2px 6px rgba(23,21,15,0.06),0 30px 80px rgba(23,21,15,0.14);
|
|
--btn-bg:#0d7a6a;
|
|
--btn-bg-hover:#0a5f53;
|
|
--btn-fg:#ffffff;
|
|
--danger:#b3261e;
|
|
--serif:"Fraunces",Georgia,serif;
|
|
--sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
|
|
--mono:"JetBrains Mono","SF Mono",ui-monospace,monospace;
|
|
|
|
/* derived scales — codified from values currently hardcoded per-component on the
|
|
landing page; migrate components to these going forward */
|
|
--radius-xs:5px;
|
|
--radius-sm:8px;
|
|
--radius-md:12px;
|
|
--radius-lg:16px;
|
|
--radius-xl:20px;
|
|
--radius-pill:999px;
|
|
}
|
|
|
|
html[data-theme="dark"]{
|
|
--bg:#0b0b0d;
|
|
--bg-2:#111114;
|
|
--surface:#151519;
|
|
--ink:#f1eee7;
|
|
--ink-soft:#c9c5bb;
|
|
--muted:#969186;
|
|
--faint:#635f57;
|
|
--line:#242428;
|
|
--line-strong:#333338;
|
|
--accent:#4fd0b8;
|
|
--accent-ink:#7de3cd;
|
|
--accent-soft:rgba(79,208,184,0.1);
|
|
--highlight:#e6b74a;
|
|
--highlight-soft:rgba(230,183,74,0.22);
|
|
--glow:rgba(79,208,184,0.16);
|
|
--grain-opacity:0.05;
|
|
--nav-bg:rgba(11,11,13,0.8);
|
|
--shadow:0 1px 2px rgba(0,0,0,0.4),0 12px 40px rgba(0,0,0,0.5);
|
|
--shadow-lg:0 2px 6px rgba(0,0,0,0.5),0 30px 80px rgba(0,0,0,0.6);
|
|
--btn-bg:#0d7a6a;
|
|
--btn-bg-hover:#0a5f53;
|
|
--btn-fg:#ffffff;
|
|
--danger:#f28b82;
|
|
}
|