The DesignCloud brand.

Sketchbook Sky: warm paper, confident cobalt ink, drawn clouds, and one coral pop. Elegant, professional, creative, fun — in that order when they conflict.

01 — The Brand

What DesignCloud is

DesignCloud is the working surface of JS Designs, an Aurora, Ontario design studio serving Toronto & the GTA. Finished work lives at jsdesigns.ca; work in motion lives here — project previews, living brand guidelines, and asset delivery on client subdomains.

Elegant
Professional
Creative
Fun

The brand is deliberately not JS Designs: light where the studio is dark, cobalt where it is lime, rounded where it is sharp. The two share one thing — care.

02 — Logo

The badge and the lockup

The primary mark is the badge: a cobalt cloud carrying a lowercase “dc”. It works alone as an avatar and favicon; the full lockup adds the wordmark with its coral full-stop. Current SVGs are working drafts — curves may be refined, file names are the contract.

Badge · paper

Badge · reversed

Lockup · paper

Lockup · reversed

Rules

Clear space: keep a margin equal to the height of the cloud’s small bump on all sides.
Minimum size: badge 24px, lockup 120px wide.
Don’t rotate, stretch, add shadows, or recolour outside the palette.
Don’t set the wordmark in any face but Bricolage Grotesque.

03 — Colour

Sketchbook Sky palette

#FAF7F0

Paper

Background canvas

#BFD9F2

Sky

Washes, cloud fills, tints

#2B4ACB

Cobalt

Brand colour — links, buttons, drawn clouds

#FF6B57

Coral

Pop accent — full-stops, highlights. Rationed.

#232323

Charcoal

Body text

The coral ration: coral is a punctuation mark, not a paint bucket — full-stops, highlights, hover states. Never body text (contrast ~3:1 on paper), never large fills.
Contrast: charcoal-on-paper and paper-on-cobalt both clear WCAG AA for body text. Focus outlines are 3px cobalt.

04 — Type

Bricolage carries the personality, Inter carries the words

Where work takes shape

Bricolage Grotesque · headings, buttons, labels · 400 / 600 / 700

Inter handles everything longer than two sentences: body copy, captions, forms. It stays out of the way so the clouds and the cobalt can do the talking.

Inter · body · 400 / 600

Scale: h1 clamp(2.2rem–3.5rem) · h2 1.75rem · h3 1.25rem · body 1.05rem, line-height 1.6.
Bricolage never below 1rem; Inter for anything longer than two sentences.
Typographic quotes in prose, always.

05 — Motion

A light touch

Motion is weather, not fireworks. This section is a live demonstration: the strip below parallaxes as you scroll and its clouds drift slowly; the sections of this page reveal once as they enter view.

The contract

Nothing moves more than 16px on reveal or interaction.
Nothing loops except cloud drift (60–120s, ±24px).
Parallax factors never exceed 0.5.
Reveals fire once — content never re-animates.
Under prefers-reduced-motion: reduce, all of it — parallax, drift, reveals, hovers — switches off, and the page is complete without it. If this section is sitting still, that’s your settings working.

06 — Voice

Friendly, plainly

First person plural. Short sentences. One weather metaphor per screen, maximum. Say “work in progress” plainly — never corporate filler.

DoYour proofs are ready when you are.

Don’tLeveraging cloud-based solutions to optimize deliverable workflows.

DoWe’ll keep this page current as the brand grows.

Don’tThis document is subject to periodic revision cycles.

DoSomething’s taking shape — have a look.

Don’tFeast your eyes on a symphony of synergistic sky-high creativity!!

07 — Usage

Where the brand lives

designcloud.ca — this site: the public face, fully indexable.
Client subdomains (company.designcloud.ca) — project previews and deliverables. Always noindex: drafts never reach search engines.
Proof emails and share links — badge as avatar, lockup in headers.
Attribution:every DesignCloud property carries “DesignCloud is built and run by JS Designs” in the footer, linking to jsdesigns.ca.