darkSVG ↓
OPENBRACKET / IDENTITY SYSTEMINTERNAL REFERENCE
Room for ideas.
A shape of our own.
The pieces that make us OpenBracket. A working reference for keeping every expression clear, considered, and unmistakably ours.
SMALL STUDIO. OPEN POSSIBILITIES.
Precise structure.
A little unexpected depth.
01 / ONE IDENTITY. EVERY FORMAT.
One identity. Every format.
Original vector artwork, ready for light and dark surfaces. Each SVG has a transparent background and lettering built from paths.
Stacked
Centered lockup · recommended minimum 220px
Icon
Compact mark · minimum 24px; prefer flat below 32px
Reference sheets & legacy artwork
The comparison sheets collect the current family. The previous logo is archived for reference; use the current SVGs for new work.
02 / GIVE THE MARK ITS SPACE.
Give the mark its space.
Keep the geometry intact, the lettering legible, and the surrounding space deliberate.
Preserve the proportions
Scale the complete artwork evenly. Keep at least one bracket-stem width of clear space on every side.
Don’t stretch or distort
Never squeeze, skew, rotate, or rearrange the mark and lettering.
Choose a readable version
Use white lettering on dark surfaces, charcoal on light surfaces, and the flat icon for very small placements.
Don’t improvise the artwork
Avoid recoloring, extra shadows, outlines, busy backgrounds, and recreating the wordmark with a font.
03 / WARM NEUTRALS. A RED THREAD.
Warm neutrals. A red thread.
Red anchors the identity. Soft, slightly olive neutrals give the interface warmth; the accent adapts to each theme.
Brand & action colors
Brand red
#DE3736Mark highlight
#F17B70Side plane
#A12726Side plane
#922522Deep plane
#822020Button / CTA
#C52D2DButton hover
#B62828White
#FFFFFFCharcoal wordmark
#171815Black
#000000Dark interface
Background
#111210Text / ink
#F5F4EDSurface
#1A1C17Panel
#1B1C19Paper
#20221CMuted text
#ADB0A5Accent
#F27B75Lines
#3C3E36Window bar
#30332BField border
#73786AError
#FFB0A7Success
#C5E0B7Light interface
Background
#F7F6EFText / ink
#171815Surface
#FFFEF8Panel
#EEEEE5Paper
#E9E9DFMuted text
#55594FAccent
#A32929Lines
#B3B7A7Window bar
#E1E3D7Field border
#7E8571Error
#A52323Success
#2C642DTHE FINISHING LAYERS
Header: dark #111210F7 / light #F7F6EFF7. Grid: dark #FFFFFF08 / light #00000009. Shadow: dark #000000 / light #C3C7B7. Eight-digit hex values include transparency.
Use the theme’s text and accent tokens for readable copy. Brand red and the dimensional highlights belong primarily to artwork; buttons pair white text with #C52D2D.
04 / STRAIGHTFORWARD, WITH CHARACTER.
Straightforward, with character.
Four locally hosted font families power the site. WOFF2 files are served from our own domain, with no requests to Google Fonts.
01 / BODY & DISPLAY
Google Sans
Google Sans, sans-serif · variable 400–700Headlines, paragraphs, navigation, and buttons. Regular and bold weights establish the hierarchy.
Thoughtfully
built.
built.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & @ # ? !
Regular 400Semibold 600Bold 700
02 / EDITORIAL ACCENT
Gelasio
Gelasio, serif · variable 400–700Italic emphasis within headlines. Bracket posters also use the upright serif. The home hero pairs Google Sans 500 with Gelasio italic 500 at 94% of the heading size for a balanced visual weight. Keep the accent selective.
Open to
possibilities.
possibilities.
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj
0123456789 & ( ) [ ]
03 / LABELS & DETAILS
Courier Prime
“Courier Prime”, monospaceEyebrows, section numbers, metadata, and terminal details. Main labels use 13px and 0.8px tracking; regular and bold weights support the hierarchy. Compact controls use smaller sizes.
IDEAS IN.
GOOD THINGS OUT.
GOOD THINGS OUT.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 / [ ] →
04 / DOTTED ACCENT
Doto
Doto, sans-serif · variable 100–900A dot-matrix accent for the DFW maker’s stamp and keyboard edition label. Use bold weights and short phrases; keep small functional text in Courier Prime.
FORGED IN DFW.
Aa Bb Cc 0123456789
OPEN POSSIBILITIES.
THE WORDMARK IS ARTWORK
The angular OpenBracket lettering is custom vector geometry, not a typeface. Use the supplied SVG lockups to reproduce it.
OPENBRACKET / BRAND GUIDEBack to the beginning ↑