brand: Scirium logo (The Cited Element) and design-token SSOT
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).
This commit is contained in:
root
@@ -0,0 +1,68 @@
|
||||
/* 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;
|
||||
}
|
||||
@@ -0,0 +1,115 @@
|
||||
{
|
||||
"name": "Scirium",
|
||||
"version": "1.0.0",
|
||||
"updated": "2026-08-16",
|
||||
"source": "Extracted from the converged landing page (mockups.itpropartner.com/scirium). Color, font, and shadow tokens are exact; radius and type scale are codified from values currently hardcoded per-component.",
|
||||
"brand": {
|
||||
"primary": "#0d7a6a",
|
||||
"primaryHover": "#0a5f53",
|
||||
"ink": "#17150f",
|
||||
"paper": "#f5f3ee",
|
||||
"dark": "#0b0b0d",
|
||||
"amber": "#f0c14f"
|
||||
},
|
||||
"theme": {
|
||||
"light": {
|
||||
"color": {
|
||||
"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)",
|
||||
"nav-bg": "rgba(245,243,238,0.82)",
|
||||
"danger": "#b3261e",
|
||||
"btn-bg": "#0d7a6a",
|
||||
"btn-bg-hover": "#0a5f53",
|
||||
"btn-fg": "#ffffff"
|
||||
},
|
||||
"shadow": {
|
||||
"default": "0 1px 2px rgba(23,21,15,0.05), 0 12px 40px rgba(23,21,15,0.07)",
|
||||
"large": "0 2px 6px rgba(23,21,15,0.06), 0 30px 80px rgba(23,21,15,0.14)"
|
||||
},
|
||||
"grainOpacity": 0.035
|
||||
},
|
||||
"dark": {
|
||||
"color": {
|
||||
"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)",
|
||||
"nav-bg": "rgba(11,11,13,0.8)",
|
||||
"danger": "#f28b82",
|
||||
"btn-bg": "#0d7a6a",
|
||||
"btn-bg-hover": "#0a5f53",
|
||||
"btn-fg": "#ffffff"
|
||||
},
|
||||
"shadow": {
|
||||
"default": "0 1px 2px rgba(0,0,0,0.4), 0 12px 40px rgba(0,0,0,0.5)",
|
||||
"large": "0 2px 6px rgba(0,0,0,0.5), 0 30px 80px rgba(0,0,0,0.6)"
|
||||
},
|
||||
"grainOpacity": 0.05
|
||||
}
|
||||
},
|
||||
"font": {
|
||||
"family": {
|
||||
"serif": ["Fraunces", "Georgia", "serif"],
|
||||
"sans": ["Inter", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "sans-serif"],
|
||||
"mono": ["JetBrains Mono", "SF Mono", "ui-monospace", "monospace"]
|
||||
},
|
||||
"weight": {
|
||||
"regular": 400,
|
||||
"medium": 500,
|
||||
"semibold": 600
|
||||
},
|
||||
"size": {
|
||||
"display": "clamp(46px, 6.2vw, 82px)",
|
||||
"h2": "clamp(32px, 4.4vw, 52px)",
|
||||
"h3": "22px",
|
||||
"quote": "21px",
|
||||
"lead": "19px",
|
||||
"brand": "19px",
|
||||
"body": "16px",
|
||||
"bodySmall": "14px",
|
||||
"meta": "13px",
|
||||
"label": "12px",
|
||||
"micro": "11px",
|
||||
"caption": "10px"
|
||||
}
|
||||
},
|
||||
"radius": {
|
||||
"xs": "5px",
|
||||
"sm": "8px",
|
||||
"md": "12px",
|
||||
"lg": "16px",
|
||||
"xl": "20px",
|
||||
"pill": "999px"
|
||||
},
|
||||
"breakpoint": {
|
||||
"1024": "hero/problem grids collapse to 1 column; roadmap 2-col; contact 1-col",
|
||||
"900": "nav links hidden",
|
||||
"820": "comparison table stacks; examples 1-col; form 1-col",
|
||||
"720": "invariant (channel) grid 1-col",
|
||||
"640": "section padding reduced; roadmap 1-col; footer and callout stack"
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user