brand-identity
Brand identity sets from one brief - logo, typography and colour palette built together, measured (contrast, colour blindness, glyph coverage, font licences, small-size logo renders) and compared side by side as identity cards, shown on the user's own site, then a brand guidelines kit (PDF, logo files, tokens) for the chosen set. Use for a new brand or any part of one (logo, fonts, colours, or a mix), for refreshing an identity, or for critiquing one, even if the user only says "branding".
Install
npx skills add https://github.com/fatihaydost/brand-identity-skill --skill brand-identityLogo
Conceiving, drawing and fixing a set's mark. Tags: [strong] primary text/standard, [limited] few studies,
[practice] designer consensus or our render test.
What a mark must do
- Identify, not explain. Meaning comes from use; the hard requirement is one colour and very small sizes
(Rand 1991).
[practice] - Distinctive, appropriate, simple, not empty. Liked, recognisable marks are natural, harmonious and moderately
elaborate (Henderson & Cote 1998)
[limited]; complex marks gain more with exposure, so a new brand leans simple (van Grinsven & Das 2016).[limited] - Literal is a trade-off. Descriptive marks help new, small brands, less once known, and hurt in negative
categories (Luffarelli et al. 2019)
[limited]; it costs distinctiveness. Describe in a descriptor line or one hint, never a category cliché (ai-defaults.md). - Shape language from the axes (context-bound,
[limited]): round → soft, angular → durable (Jiang et al. 2016); angular → premium under status motives (Li et al. 2023); asymmetry → exciting, harmful if the brand is not (Luffarelli et al. 2019b). - Refresh = evolution. Rounding an angular logo lowered committed customers' attitudes
(Walsh et al. 2011).
[limited]Name what is kept before drawing.
Process (per round, all sets on one contact sheet)
- Per set, 4–6 one-sentence ideas; each says why it is this brand's and not the category's.
- Build one. First write the construction in words: primitives, grid unit, radii, angles.
brand.py logos WORKrenders large, 32, 16 px, colour and one colour. Look. In our test a broken mark passed every automated check; only looking caught it.[practice]- One named defect per mark per round, at most 2 rounds. Render feedback helps strong models a little
(IntroSVG, CVPR 2026) and is inconsistent in off-the-shelf VLMs, where extra
rounds add breakage (arXiv 2608.28678).
[limited] - Read it cold at 16 px: does a letter read as another, does a join clog?
SVG construction (sets.json → symbol_svg)
viewBox="0 0 100 100", primitives (circle, rect, rounded rect, polygon, short arcs), each with a semanticid. LLMs place primitives well and fail at complex geometry (Chat2SVG; SVGenius; VGBench).[limited]- Fills, not strokes (strokes are outlined anyway). Holes are real:
data-op="subtract"orfill-rule="evenodd", never a ground-coloured shape on top. - Booleans:
data-op="union|subtract|intersect"on a shape, resolved with skia-pathops in document order. - Colour by role:
data-color="primary|accent|text|…"on each part; no hex in the master. - No
<text>,<image>,filter,foreignObject. The wordmark is outlined from the display face by the pipeline (identity.logo.wordmark); live text fell back to another font in our test.[practice] - Compute, don't eyeball: endpoints from sin/cos; repeated parts share exact radius, angle and thickness.
symbol_small_svg(optional): simplified favicon drawing.
Lockups and system [practice]
- Wordmark from the set's display face, tracked, plus at most one ownable detail by boolean (cut terminal, shared stroke, the symbol's angle or radius in one letter). Custom letters only for short wordmark-only names.
- Symbol corners, cut angles and weight follow the font's contrast and terminals; a round symbol with a hard grotesk only as deliberate contrast.
- Lockups horizontal and stacked; unit = cap height; symbol aligned optically to the cap-height band.
- Clear space from the mark's own unit; minimum size just above where its defining feature vanishes (px, mm).
- Note 1–2 misuses only this mark can suffer (filled stencil gap, moved symbol); the kit draws them (
kit.md). - Parts that sit side by side differ in lightness, not hue alone.
- OFL fonts may be outlined into a logo; the graphic is yours, no attribution
(OFL-FAQ).
[strong]Other licences need written logo permission.
Checks (logo_audit.py, no score)
Gates: the SVG rules above, 16/32 px renders, ≥ 3:1 on every ground or a declared tile
(WCAG 1.4.11, as practice: logos are exempt),
thinnest feature survives min_size, font licence. Warnings (heuristic, uncalibrated): > 3 colours, near-equal
radii/angles, detail growth without a named defect, logo.tags hits.
Optical corrections (kit stage) [practice]
Type-design practice (Tracy, Letters of Credit; Cheng, Designing Type); amounts from the display font: overshoot = the font's O/H ratio on round and pointed parts; horizontals = its crossbar/stem ratio; tile content sits slightly above centre; reversed marks spread, so use negative GRAD if available and inset the symbol slightly, judged at 32 px.