# Measure Joy — Brand notes

Version 1.0 · October 2026

## The idea
Little camera. Big feeling. Measure Joy celebrates imperfect pictures and fully felt moments. Editorial space meets a playful Y2K wink: warm paper, sharp type, chrome, coral, and one bright flash of acid yellow.

## Logo
The original viewfinder-smile mark combines four camera-frame corners, two eyes, and a curved smile. Use the horizontal lockup by default, stacked when the space is square, and the icon at small sizes. Keep at least 40 units of clear space around the 128-unit icon (the eye-to-eye distance). Minimum icon size: 24 px, except the purpose-built 16 px favicon. Minimum horizontal logo width: 160 px.

Use ink on ivory, acid, or silver; ivory on ink; coral on ivory for larger decorative marks. Do not stretch, rotate, add effects, crop the symbol, change its proportions, or invent new colors. Preserve the lowercase wordmark.

The standard SVGs contain editable vector geometry and outlined text. Files ending in -editable.svg retain editable text; install the included Space Grotesk Bold font first. All logos have transparent backgrounds. The PNG versions are convenience exports, not source artwork.

## Color
| Color | Hex | Role |
|---|---|---|
| Ivory | #F4F1E8 | Primary page/background |
| Ink | #191919 | Body copy, logos, primary actions |
| Coral | #FF5439 | Energy, large panels and highlights |
| Acid yellow | #DAFF4F | Occasional badges, flashes and accents |
| Silver | #C7C9CF | Cool neutral and hardware references |

Lead with ivory and ink. Use coral with intention and acid sparingly. Use ink text on all four light/brighter backgrounds. Avoid small ivory text on coral or silver. For body text, maintain WCAG AA contrast (4.5:1).

## Type
Space Grotesk is the everyday voice: headings, navigation, product details and the wordmark. Instrument Serif Italic adds feeling in short editorial headlines, never long text. Both families use the SIL Open Font License; licenses and font sources are included. Keep body copy at least 16 px on the web, and use generous line spacing.

## Voice
Warm, observant, a little cheeky. Write like a friend who notices the good light. Short phrases, ordinary language, no technical posturing. Say “Little camera. Big feeling.” or “For the moments that feel like you.” Do not promise technical performance without verified product specifications.

## Photography and layout
Use candid flash, warm skin tones, imperfect framing, everyday scenes, and tactile product close-ups. Leave calm negative space. Combine a strong editorial grid with occasional off-grid stickers or a rotated image. Limit decorative tricks to one or two per composition.

## Using this kit
- Logos: outlined SVG and transparent PNG in ink, ivory, coral; horizontal, stacked and icon formats.
- Editable wordmarks: live SVG text with included fonts.
- Icons: multi-size ICO, SVG favicon, 180 px Apple icon and 192/512 px app icons.
- Social: 1080 px acid/coral avatars, 1200 × 630 px open-graph artwork.
- Templates: 1080 × 1080 square and 1080 × 1920 story; editable SVG, outlined SVG and PNG preview. Replace the coral photo placeholder with your own image. Template copy is editable; install fonts first.
- tokens.css and tokens.json: reusable design values.
- asset-manifest.json: file inventory with sizes and hashes.

SVG files contain no embedded raster images. Templates are intended for vector editors such as Figma, Illustrator or Inkscape. Recolor fills and strokes directly. Fonts may substitute in applications that do not have them installed.

## Font sources
- Space Grotesk: https://github.com/floriankarsten/space-grotesk (static Bold and Medium); https://github.com/google/fonts/tree/main/ofl/spacegrotesk (variable font and OFL).
- Instrument Serif: https://github.com/google/fonts/tree/main/ofl/instrumentserif (Italic and OFL).

The viewfinder-smile drawing and layout system were created for this Measure Joy concept. This kit does not claim trademark registration or clearance.
