# Shabs.Dev brand kit

A bespoke wordmark drawn as filled vector outlines. Use the full name first; its square period is part of the logo.

## Files

- `wordmark-accent-dark.svg`: primary full name in warm white with a signal red period for dark backgrounds.
- `wordmark-accent-light.svg`: the light background equivalent.
- `stacked-accent-dark.svg`: the full name in two lines for square layouts.
- `*-white.svg` and `*-black.svg`: one colour versions for print and reproduction.
- `avatar-full-name.svg`: full name in a square avatar; use when it stays legible.
- `avatar-*.svg`: supporting S. shorthand tiles for small profile photos.
- `social-card.svg` and `social-banner.svg`: editable social layouts with PNG exports.
- `favicon-*.png`: small browser icons.
- `favicon.svg` and `apple-touch-icon.png`: site icons included in the brand kit.
- `brand-board.svg`: vector presentation board. Logo paths open directly in Illustrator or Figma.

All logo letters are original outlines. Artwork needs no font, linked image, effect, or remote asset. Edit `scripts/brand-geometry.mjs` and run `npm run brand` to rebuild the set.

Scale the wordmark proportionally. Keep one period width of clear space around it. Keep the period in every full name version. Use S. when the full name cannot remain legible.

Ink `#08080A` · warm white `#F2F0EC` · signal red `#D72638`.
