DoubleSharp
Brand & design
The DoubleSharp identity: eight equal rings that meet at a shared center to form the musical double-sharp. This page collects the logo files, colors, type and interface rules for anyone presenting the brand.
01 / Logo
Logo files
Every version shares the same circle-derived geometry and outlined lettering, so no font is needed. Use the light files on light surfaces and the dark files on dark surfaces. Backgrounds are transparent. SVG is the master format; PNGs are transparent sRGB exports.
Looking for everything at once? The standalone asset gallery lists every file, and the file guide explains how each one is built.
02 / Color
Color
The emblem's eight rings each blend through three spectrum colors. Ink and Paper carry the lettering and center mark. Select a swatch to copy its hex value.
Core
Ring spectrum
Spectrum colors are for the mark, rules and small accents. Keep text in Ink, Paper or the interface colors below. Ask print providers to proof RGB to CMYK conversion before a production run.
03 / Typography
Typography
The wordmark is custom outlined lettering. Always use the supplied logo files and never retype it in a font. Interface text uses a clean grotesque sans, with a monospace for labels, metadata and code.
Inter
Headings, body copy and interface. Falls back to the platform UI sans-serif.
Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serifRegular 400Medium 550Semibold 600Bold 650
System monospace
Eyebrows, labels, version tags, metadata and code samples.
ui-monospace, SFMono-Regular, Consolas, monospace0123456789 ## →
- Displayclamp(50–78 px) · 650 · line 0.99 · tracking −0.06em
- Good ideas deserve solid engineering.
- Page titleclamp(38–62 px) · 600 · line 1.08 · tracking −0.055em
- Brand & design
- Section headingclamp(28–40 px) · 600 · line 1.15 · tracking −0.045em
- Harmony in more dimensions
- Card heading24 px · 600 · line 1.25 · tracking −0.035em
- Expert integration & implementation
- Body16 px · 400 · line 1.8
- We design, build and maintain dependable software, and we explain it clearly along the way.
- LabelMonospace · 10 px · uppercase · tracking 0.1em
- DOUBLESHARP / SOFTWARE CONSULTING
04 / Interface
Interface colors & shape
The website ships light and dark appearances from one set of tokens. Accent teal is tuned separately for each so links and focus rings keep their contrast.
| Token | Role | Light | Dark |
|---|---|---|---|
--js-bg | Page background | ||
--js-surface | Cards and panels | ||
--js-ink | Primary text | ||
--js-muted | Secondary text | ||
--js-line | Borders and rules | ||
--js-accent | Links, focus and labels | ||
--js-tint | Highlights and callouts | ||
--js-graphic | Line illustration |
Borders are 1 px hairlines in --js-line. Content sits in a 1280 px column with 48 px gutters, narrowing to 30 px and then 24 px on smaller screens.
05 / Usage
Using the mark
Do
- Use the light files on light backgrounds and the dark files on dark backgrounds.
- Keep the emblem at 32 px or larger, the symbol at 16 px or larger and the horizontal logo at 240 px or wider.
- Use the single-ink versions for engraving, vinyl, stamps and one-color print.
- Scale proportionally from the SVG masters.
Don't
- Stretch, rotate or redraw the mark or lettering.
- Recolor individual rings or swap the spectrum order.
- Add shadows, outlines, glows or other effects.
- Place the logo on busy photography or low-contrast color.