Alloy
Feature Stack
Loading
AI-powered digital sales rooms for HubSpot and Salesforce teams – Arrows
Cool, structured digital space: deep blues and soft grays, precise sans-serif clarity.
Click any value to copy. Roles are suggestions, not gospel.
- #1491f5oklch(64.7% 0.178 250)Dominant
- #82c4faoklch(79.7% 0.102 244)Surface
- #05497foklch(39.9% 0.109 250)Ink
- #7f94a7oklch(65.7% 0.037 246)Accent
- #bcbdbeoklch(79.8% 0.002 248)Detail
Read off the live site. Treat it as reference, not a recipe.
| Role | Family | Size | Weight | Leading | Tracking | Sample |
|---|---|---|---|---|---|---|
| h1 | Geist | 64px | 700 | 1.06 | -1.28px | Aa Bb Cc |
| h2 | Geist | 28px | 700 | 1.21 | -0.28px | Aa Bb Cc |
| h3 | Geist | 24px | 600 | 1.21 | -0.48px | Aa Bb Cc |
| body | Arial | 22px | 400 | 1.45 | 0 | Aa Bb Cc |
| button | Geist | 13px | 400 | 1.75 | 0 | Aa Bb Cc |
Max content width 1440px
:root {
--color-dominant: #1491f5;
--color-surface: #82c4fa;
--color-ink: #05497f;
--color-accent: #7f94a7;
--color-detail: #bcbdbe;
}
/* CSS variables exposed by source */
:root {
--_color-theme---red-10: #f64b311a;
--light-green: #58d66c0f;
--yellow: #ffc30f;
--green: #58d66c;
--_color-theme---yellow-01: #ffd37e;
--aqua: #16b7d1;
--_color-theme---black-2-60: #181c1f99;
--_color-theme---blue-01: #71bdff;
--pink: #f595ac;
--_color-theme---red-01: #ffaea1;
--_color-theme---green-10: #0f99621a;
--_color-theme---yellow-20: #fab32833;
--_color-theme---black-1: #0a0a0a;
--black: #1b1f22;
--_color-theme---white: white;
--_color-theme---blue-02: #f6fbff;
--black-30: #1b1f224d;
--_color-theme---white-50: #ffffff80;
--white: white;
--white-50: #ffffff80;
--_color-theme---orange-02: #fff0ec;
--_color-theme---blue-10: #0a8afa1a;
--red: #fd5f4a;
--_color-theme---yellow: #fab328;
--_color-theme---green-01: #5dcea1;
--_color-theme---white-10: #ffffff1a;
--_color-theme---black-2: #181c1f;
--_color-theme---offwhite: #f6f4f1;
--_color-theme---black-1-20: #0a0a0a33;
--_color-theme---black-60: #0009;
--black-6: #171a1c0f;
--_color-theme---orange-01: #ff7a59;
--_color-theme---green-20: #0f996233;
--_color-theme---white-20: #fff3;
--_color-theme---yellow-10: #fab3281a;
--_color-theme---red-20: #f64b3133;
--_color-theme---black-10: #0000001a;
--black-60: #171a1c99;
--navy: #1c2732;
--white-10: #ffffff1a;
--_color-theme---black-3-white-60: #232323;
--_color-theme---black-1-10: #0a0a0a1a;
--_color-theme---blue: #0a8afa;
--blue-6: #309cfc0f;
--purple: #878ae8;
--yellow-6: #ffc30f0f;
--_color-theme---blue-20: #0a8afa33;
--black-10: #0000001a;
--_color-theme---black: black;
--_color-theme---transparent: transparent;
--_color-theme---white-01: #fcfcfb;
--blue: #309cfc;
--_color-theme---green: #0f9962;
--_color-theme---black-1-60: #0a0a0a99;
--_color-theme---red: #f64b31;
--_color-theme---black-1-80: #0a0a0acc;
--_color-theme---black-30: #1b1f224d;
--offwhite: #f5f6f7;
--orange-6: #fa78200f;
--orange: #ff704c;
}Drop-in prompt
Build a landing page in the visual style of AI-powered digital sales rooms for HubSpot and Salesforce teams – Arrows.
Reference design system (extracted from the live site):
- Palette: #1491f5, #82c4fa, #05497f, #7f94a7, #bcbdbe
- Typefaces: Geist, Arial
- Macrostructure: Feature Stack
Use the dominant colour for surfaces, the accent sparingly,
and lean on type weight + scale rather than colour for hierarchy.
Full DESIGN.md: https://inspomcp.dev/api/design/arrows-to
