LogoColourTypeIn useDashboard UITokensBrand center · v1LogoColourTypeIn useDashboard UITokensBrand center · v1Logo, colour, type and dashboard components for the Dex platform, compiled from the brand guidelines, the hardware mockups and the system screens.
● Brand center v1 · 2026
The mark is a bold “D” built from a single open stroke. It comes complete (with the wordmark) or reduced (mark only), in navy and cyan, in white, and in greyscale.
complete · prioritycomplete · white
reduced · priority
reduced · white
auxiliary · grey
auxiliary · grey, white
auxiliary · reduced grey
reduced · on discPrint, documents, LinkedIn
Posts and feed compositions
Success, alert and error. Green also flags sales and profit; red flags loss.
For charts that need to tell series apart without implying profit or loss.
Values, RGB and CMYK come from the brand guidelines. The five-step tint rows are derived by mixing each colour with white.
Corporate material pairs Montserrat Alternates SemiBold (titles) with Roboto Regular (body). The dashboard uses Montserrat Regular and Bold.
:root {
/* colour · corporate */
--dex-navy-800: #1F3E62; --dex-cyan-500: #00CCCC;
--dex-white: #FFFFFF; --dex-grey-100: #EDEDED;
/* colour · social */
--dex-rose-300: #DFB7BE; --dex-clay-600: #92594D;
/* colour · systems */
--dex-success-500: #0ECC6D; --dex-alert-500: #ED975D; --dex-error-500: #E06868;
--dex-legend-1: #0ECCCC; --dex-legend-2: #262660;
--dex-legend-3: #CC74CC; --dex-legend-4: #754677;
--dex-cyan-800: #13748A; /* cyan text on light */
/* type */
--dex-font-title: "Montserrat Alternates", sans-serif; /* SemiBold */
--dex-font-body: "Roboto", sans-serif; /* Regular */
--dex-font-ui: "Montserrat", sans-serif; /* systems */
/* shape */
--dex-radius-card: 16px; --dex-radius-pill: 999px;
--dex-shadow-card: 0 8px 22px rgba(31, 62, 98, .12);
}