Brand standards

Brand
standards.

One mark, three colours, three typefaces, square corners. This is the document that governs everything Delcaro Media puts in front of a client. It is public on purpose — most people have never seen inside one, and this is what you get when you hire us to build your brand.

01

The mark

The mark is one piece of artwork. DELCARO sits inside a rule box. MEDIA breaks the bottom rule and hangs below it. Nothing in it is live text, so no font is needed to reproduce it.

Primary — Ink on Paper

Reverse — Paper on Ink

Tinted ground — Ink on Mist

Accent ground — Paper on Blue

Clear spaceRule 1X

X is the cap height of the M in MEDIA. Keep 1X clear on all four sides. Nothing enters that band: no type, no photo edge, no rule, no page trim. Measure from the outer edge of the rule box, and from the lowest point of MEDIA at the bottom.

1X1X1X1XXMINIMUM CLEAR SPACEM CAP

Constructionmeasured from the master

Every proportion is expressed against C, the cap height of DELCARO. The mark is fixed artwork, so these are for checking a file, not for redrawing one.

Proportions — master artwork 855 × 240 px
ElementMaster pxRatio to CNote
DELCARO cap height (C)1341.000The reference for everything below
Rule box stroke160.119Even weight on all four sides
Rule box, outer width8556.381Full artwork width
Rule box, outer height2271.694Excludes the MEDIA overhang
MEDIA cap height (X)630.470Also the clear-space unit
MEDIA overhang below the box140.104Deliberate. Never trim it flush
Inset, left rule to D320.239
Inset, top rule to cap280.209
Inset, baseline to bottom rule340.254
Bottom rule break621 → 81872.6% to 95.7% of width. MEDIA sits in the gap
Artwork aspect ratio3.559 : 1Lock it. Never scale one axis

Minimum size

Smallest permitted reproduction
MediumMinimum widthFalls back to
Screen160 pxD monogram below this
Print, offset or digital38 mm / 1.5 inD monogram below this
Embroidery, engraving, vinyl50 mm / 2 inThe rule break closes up below this
Favicon and app iconanyD monogram only

The failure point is always MEDIA. Below these sizes the 14 px overhang and the rule break stop reading, and the mark turns into a black bar.

D monogramsquare and round placements

Where the full mark cannot hold, the D from the wordmark stands in. Use it for favicons, app icons, avatars, watermarks, and anything under the minimum width. It never replaces the full mark on a first impression: a website header, a card, a proposal cover, or an invoice always carries the full mark.

Square 1:1
Round
Favicon 48px
Inverted

The D fills 68% of the tile height and is optically centred. Optical centring is not geometric centring: the round bowl needs a hair more space on the right than the flat stem needs on the left.

02

What breaks the mark

The mark is supplied as one vector file with one colour. Scale it, place it, and stop. Red in this section marks an error. Red is not a brand colour and never appears in Delcaro Media work.

Do not stretch. Lock the 3.559 : 1 ratio.

Do not squash to fill a space.

Do not rotate or tilt. The mark is always level.

Do not recolour. Ink or Paper only.

No gradients behind it and none inside it.

No shadow, bevel, glow, or outline.

Do not convert the fill to a stroke.

Do not crowd it. Hold 1X on every side.

Not on a busy photo. Add a solid panel or a scrim first.

Hold 4.5:1 against the ground. Mid greys fail.

Two more that a screenshot cannot show. Never re-typeset the mark in a font — the letterforms are outlines and no font matches them. Never rebuild it from a raster PNG when the vector is available.

03

Colour

Three colours carry the brand: Ink, Paper, and one electric blue. Everything else is a support tone that exists to keep those three readable.

Core

Ink
Ink
Hex
#0C0C0F
RGB
12 · 12 · 15
CMYK
60 · 50 · 45 · 100 rich black
HSL
240 · 11% · 5%
Token
--color-ink
Paper
Paper
Hex
#FAFAF9
RGB
250 · 250 · 249
CMYK
0 · 0 · 0 · 2
HSL
60 · 9% · 98%
Token
--color-paper
Electric Blue
Electric Blue
Hex
#2563EB
RGB
37 · 99 · 235
CMYK
84 · 58 · 0 · 8
HSL
221 · 83% · 53%
Token
--color-accent

Support

Ink Soft
Ink Soft
Hex
#16161B
RGB
22 · 22 · 27
Use
Raised panels on Ink
Mist
Mist
Hex
#F0F0F2
RGB
240 · 240 · 242
Use
Section bands, table heads
Line
Line
Hex
#E2E2E6
RGB
226 · 226 · 230
Use
1px rules and borders only
Muted
Muted
Hex
#4B4B55
RGB
75 · 75 · 85
Use
Secondary body text on Paper
Accent Dark
Accent Dark
Hex
#1D4ED8
RGB
29 · 78 · 216
Use
Hover and pressed states
Accent Light
Accent Light
Hex
#3B82F6
RGB
59 · 130 · 246
Use
Links on Ink — see the note

Accent Light is a required addition. Electric Blue on Ink measures 3.78:1, which fails the 4.5:1 minimum for body text. Anywhere blue text sits on a dark ground — a footer, a dark slide, a dark email — use Accent Light instead. It measures 5.31:1.

Contrast

WCAG 2.1 contrast — measured, not estimated
Foreground on groundRatioBody textLarge text and UI
Ink on Paper18.70AAAAAA
Paper on Ink18.70AAAAAA
Muted on Paper8.25AAAAAA
Accent Dark on Paper6.42AAAAA
Accent Light on Ink5.31AAAAA
Accent on Paper4.95AAAAA
Paper on Accent4.95AAAAA
Accent on Ink3.78FailAA
Ink on Accent3.78FailAA
Line on Paper1.24FailFail

Line is a rule colour. It never carries text or an icon that has to be seen. Large text means 24px regular or 18.66px bold and above.

Balance

Paper 70
Ink 25
Blue 5

Blue is a pointer, not a surface. It marks the one thing you want clicked or read next. A page with two blue buttons has no blue button.

Print

Press specification
WhereBuildWhy
Ink, large solid areasC60 M50 Y45 K100Rich black. Flat K100 goes grey and mottled across a full card
Ink, type under 14 ptK100 onlyFour-plate black on small type shows registration fringe
Electric Blue, coatedPantone 2126 C (nearest)Confirm against a physical chip before any spot run
Electric Blue, processC84 M58 Y0 K8Blue shifts on uncoated stock. Proof it
PaperNo inkPaper is the stock, not a tint. Never print a light grey ground

04

Typography

Three faces, one job each. Display for headlines, body for reading, mono for labels and numbers. No fourth face, ever.

Bricolage GrotesqueDisplay600 · 700 · 800 · variable 200–800

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789

Web & brand design

Headlines only. Set tracking at -0.03em and line height at 0.95. Turn on text-wrap: balance so a headline never drops one orphaned word. Sentence case, not title case. Never set a paragraph in it.

InterBody400 · 500 · 600 · variable 100–900

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789

Independent digital studio in Kitchener, BC, serving Creston and the Kootenays. Custom websites, brand identity, apps, and IT for ambitious businesses.

Everything a person reads in sentences. Body copy runs at 1.125rem / 1.7 and stops at about 68 characters a line. Default tracking. Bold at 600, never 700.

Geist MonoLabel & data400 · 500

ABCDEFGHIJKLM 0123456789

Section labels · eyebrows · specs · code · prices · dates

Small and uppercase, tracked at 0.2em. It marks structure. It is never a headline and never a paragraph. Use it wherever digits line up in a column, with tabular-nums on.

Scale

Type scale as shipped on delcaromedia.com
RoleFaceSizeLeadingTracking
HeroBricolage 80014vw → 8vw ≥768px0.90-0.045em
Section headBricolage 700clamp 1.9 → 3.1rem0.95-0.04em
Article H2Bricolage 7001.90rem1.10-0.02em
Article H3Bricolage 7001.45rem1.15-0.02em
Article H4Bricolage 7001.20rem1.20-0.02em
BodyInter 4001.125rem1.700
Small / captionInter 4000.875rem1.550
Eyebrow / labelGeist Mono 5000.75rem1.200.20em
ButtonInter 500 uppercase0.875rem1.000.025em

Licence and substitutes

Font sourcing
FaceLicenceDesktop and printSubstitute when unavailable
Bricolage GrotesqueSIL Open Font LicenceFree to install and use commerciallyArial Black, then system sans
InterSIL Open Font LicenceFree to install and use commerciallyArial, Helvetica, system sans
Geist MonoSIL Open Font LicenceFree to install and use commerciallyConsolas, SF Mono, Courier New

All three are open licence. Install them on the workstation, in the design software, and in Office, so a proposal, an invoice, and a web page match. A substitute is for a client's own machine, not for artwork we produce.

05

Layout

Square corners, hairline rules, generous air, and type that runs big. The grid does the decorating.

The square-corner law

Border radius is 0 on everything: buttons, cards, inputs, images, badges, modals, avatars. The one exception is a round social avatar, where the platform crops it for you. A rounded corner anywhere else is off brand and reads as a stock template.

Measurements

Structure
ItemValueNote
Container max width96rem / 1536pxCentred, class .container-x
Gutter, mobile1.25rem
Gutter, ≥768px2.50rem
Section padding5rem → 7remVertical, mobile to desktop
Spacing base4pxEverything is a multiple
Rule weight1pxLine on Paper, white at 10% on Ink
Border radius0Not negotiable
Body max line length~68 charactersLong copy sits in a narrower column than the grid

Buttons and links

Start a projectSee the work
Start a projectSee the work

Primary button: solid Ink, Paper type, uppercase, hover fills Electric Blue. On Ink the button inverts to solid Paper. Text links carry a 1.5px underline that wipes in from the left on hover. One primary button per view.

06

Motion

Fast in, slow to settle. One easing curve across the whole brand.

Motion specification
PropertyValueApplies to
Easingcubic-bezier(0.16, 1, 0.3, 1)Everything. One curve, no exceptions
Hover and state change300msColour, border, opacity
Link underline wipe500msOrigin flips right → left on hover
Overlay and menu500msFull-screen mobile menu
Scroll reveal offset30px, 400–600msBelow the fold only

Above the fold never starts invisible. A reveal that ships at opacity: 0 and waits for JavaScript delays the first paint and hurts the page score. Content in the first screen animates from a visible state or does not animate. Below the fold, reveal freely.

Honour prefers-reduced-motion everywhere. When it is set, everything arrives in its final state with no transition.

07

Voice

Plain, short, and direct. A Delcaro Media sentence tells a business owner what they get, not how it was built.

Rules

Active voice. One idea per sentence. Twenty words is long. Say can, will, and must. Put the condition first: “If the form fails, we get an email.” Name things the way a client says them, not the way the system stores them. Never open by announcing what you are about to say.

Write this, not that

Write

Web & brand design that turns heads.

Not

Leveraging cutting-edge digital solutions to elevate your online presence.

Write

Your site loads in under a second on a phone.

Not

We utilise best-in-class performance optimisation methodologies.

Write

Custom websites, brand identity, apps, and IT for ambitious businesses.

Not

A full-service, end-to-end partner for all your digital needs.

Write

Say hello →

Not

Click here to submit an enquiry today!

Banned outright: solutions, leverage, synergy, seamless, cutting-edge, best-in-class, game-changing, unlock, elevate, robust. Exclamation marks in client-facing copy. Emoji in headings.

The name

Naming
ContextCorrectWrong
All client-facing copyDelcaro MediaDelcaro, DM, delcaro media
Domain and handlesdelcaromedia.comdelcaro-media.com
Web address in printwww.delcaromedia.comhttps://delcaromedia.com/
Phone250-977-5565(250) 977 5565
LocationKitchener, British ColumbiaCreston, BC

The studio is in Kitchener. Creston and the wider Kootenays are the service area, and copy says so plainly: “in Kitchener, BC, serving Creston and the Kootenays.”

08

Applications

The mark, the palette, and the three faces, applied. Anything not shown here follows the nearest example.

Business card3.5 × 2 in · 89 × 51 mm

Jon Delcarojon@delcaromedia.com
250-977-5565www.delcaromedia.com

Front

Web design · Brand identity · Apps
SEO · E-commerce · IT support

Back

Card specification
ItemSpec
Trim89 × 51 mm, square corners
Bleed3 mm all sides
Safe margin5 mm from trim
GroundInk, rich black C60 M50 Y45 K100
Mark width55 mm, top-left, 1X clear all round
NameInter 600, 9 pt, Paper
Detail linesInter 400, 7.5 pt, Paper at 72%
Stock16 pt or heavier, soft-touch matte laminate

Email signature

Jon Delcaro
Delcaro Media — Kitchener, BC
250-977-5565
jon@delcaromedia.com
www.delcaromedia.com

Plain HTML, no images except the mark, which is a PNG at 2× and 160px wide. A 3px blue rule on the left is the only colour. No quote, no legal disclaimer, no social icon row, no “sent from my phone”.

Icons and social

Digital placements
PlacementSizeArtwork
Favicon32 · 48 · 180 pxD monogram, Paper on Ink
App icon256 pxD monogram, Paper on Ink
Social avatar400 px squareD monogram, Paper on Ink
Social banner1500 × 500Full mark on Ink, left third, 1X clear
Open Graph card1200 × 630Full mark on Ink with the page headline
Video bug8% of frame widthFull mark, Paper, lower right, 4% inset

Documents

Proposals, invoices, and reports: Paper ground, full mark top-left at 45 mm, Bricolage for the title, Inter for everything read in sentences, Geist Mono for line items and totals with tabular figures. One blue element per page at most — usually the total, or the one thing to sign.

Want one of these for your business?

Brand identity, built to this standard, with the files and the rules to keep it consistent.

Start a project