Brand Standards
Logo & Lockups
The DingoBlu mark uses the DB monogram in navy and cyan, with the full DingoBlu Financial lockup reserved for wider placements and approved reversed treatments.
Colours come directly from the vector source: ink #141A2A, cyan #00AFF0, and slate #525C6B.
01 — Logo & Lockups
One mark, three readable forms
The DingoBlu mark is the DB monogram. It appears in three approved forms so it stays legible at every size: the primary horizontal lockup, a reversed lockup for dark surfaces, and a square small-size alternate for 100×100 px use cases.
Clear space
Keep generous breathing room around the logo so the monogram and wordmark stay readable. Do not crowd the lockup with other marks, rules, or page elements.
- Use the logo on clean backgrounds whenever possible.
- Maintain clear separation from nearby text and UI chrome.
- Keep the lockup visually dominant only when the page area is large enough to support it.
Minimum size
Use the full horizontal lockup only when it can stay crisp. If the wordmark becomes too tight, switch to the square monogram so the identity remains readable at small sizes.
- Primary lockup for larger header, hero, and footer placements.
- Square monogram for favicons, avatars, mobile-sized slots, and constrained UI.
- Avoid scaling the horizontal lockup down so far that the text becomes hard to distinguish.
Misuse
Keep the mark intact. Do not redraw the logo, alter the colours, stretch the proportions, or place it on busy imagery that breaks the silhouette.
- Do not change the approved ink, cyan, or slate values.
- Do not rotate, skew, or recompose the monogram and wordmark.
- Do not place the logo inside low-contrast or cluttered backgrounds.
Approved colours
02 — Colour System
The official palette, made accessible
Brand values are taken from the final vector logo and the brand board, then each role is checked against its WCAG 2.1 target. Contrast is measured against white for light surfaces or Midnight Navy for dark surfaces, so every role stays usable in real UI conditions.
Core brand
Pantone for DingoBlu Cyan is Process Cyan C, with CMYK 100/0/0/0. Logo ink, cyan, and slate are exact fills from DB_Logo_Final.svg.
Action & accessible variants
Derived UI colours should stay in the same family as the mark, but be tuned for body copy, focus states, and actions so the interface keeps a clear hierarchy on light and dark surfaces.
The DingoBlu Gradient
Deep Azure to Cyan at 135 degrees. Decorative only, it can sit behind hero panels, cards, and the app icon. Never set body text directly on it; float text on a solid plate.
Neutrals & text
Use the neutral stack for body copy, supporting labels, borders, and surfaces so content remains legible and the brand colour can stay reserved for emphasis.
Text on the navy canvas
White and cyan carry the highest contrast on Midnight Navy. Slate can support secondary copy where the hierarchy can be softer without losing clarity.
Semantic – two tunings
Semantic colours should be tuned in two modes: a lighter interaction set for white surfaces and a stronger contrast set for Midnight Navy or other dark canvases.
03 — Typography
Montserrat – one brand voice
The brand typeface is Montserrat. It is the face used in the logo wordmark and across the product: a geometric sans that feels open, confident, and easy to ship. The logo lockup pairs a Bold DingoBlu with a Light Financial in slate.
Save smarter. Bank bolder.
Your balance is $12,480.50 – up 5.6% this month.
Approved weights
Full ramp available: Thin 100, ExtraLight 200, Light 300, Regular 400, Medium 500, SemiBold 600, Bold 700, ExtraBold 800, and Black 900. The approved product subset is Light through ExtraBold for everyday UI, headings, and balance treatments.
Usage rules
- Minimum body size is 16px with line-height 1.5 or greater.
- Keep interface copy left-aligned. Never justify running text.
- Enable tabular figures for currency, balances, percentages, and other aligned numeric UI.
- Use the same Montserrat voice across headings, labels, forms, and primary actions.
The portal implementation follows this spec: Montserrat is the primary face, body copy stays at 16px or above, and financial figures use tabular numerals for steadier alignment.
Optional companion for dense data
Montserrat is geometric and wide, which makes it ideal for brand moments, headings, and balances. For long statements and dense tables at small sizes, a narrower UI or text sans such as Inter or Source Sans 3 can improve on-screen legibility. This is a recommendation only; Montserrat remains the brand typeface.
04 — Geometry & Corners
Curves borrowed from a credit card
A physical card rounds at roughly a 1:17 corner-to-width ratio. One radius ladder keeps buttons, cards, and sheets feeling like family, and like the product in the customer's wallet.
Use one radius ladder everywhere so buttons, cards, sheets, and status surfaces feel like one DingoBlu family.
05 — Buttons & Controls
Capsule-first, always reachable
Primary actions use the full pill. The fill depends on the surface: Royal carries white text on light, while on the navy canvas the primary flips to Cyan with a navy label. Every control has a visible focus ring and meets the 3:1 non-text minimum plus the 44×44px touch-target guideline.
Focus uses a 3px Cyan 300 ring with 3px offset. Inputs keep the 14px radius, their border shifts to Cyan on focus with a soft glow, and disabled states use Gray 200 fill with a Gray 500 label.