Brand Guidelines

The A.S.F. mark is the primary identifier, shown here with the A.S.F.RECS logo and the texture variant. Keep clear space equal to the height of one square; never redraw, rotate or recolor.

Minimum size: 24px height on screen.

Two families carry the whole brand. Söhne (Klim Type Foundry) speaks every Latin voice — one family, two weights, nothing else. FOT-Cezanne ProN sets Japanese. Every Latin cut is licensed and self-hosted as woff2 — no foundry CDN, and every weight the stylesheet asks for is mapped to a real file, so the browser never fakes a bold or an italic. Söhne Kräftig, Söhne Schmal and Martina Plantijn stay licensed in the library; nothing on the site asks for them.

Halbfett stands. Buch reads and lists.

Two weights carry the whole site, and one rule decides which. A third weight is a third opinion; the page is calmer without one. Ambiguity is weakness — when a thing stands, it stands without apology.

1. Article 1

   One axis of emphasis, never two. Either size does the standing or weight does, and the size decides which. At 40 and above size has already spoken, so the type stays Buch — a display line set in Halbfett is a shout. Between 12 and 24, weight does the standing. The rule follows the size, not the element: a page title that steps down to 24 on a phone has entered the band where weight stands, so on a phone it wears Halbfett.

2. Article 2

   Halbfett (600) is the skeleton. The top tabs and the bands in the controller — each one names a face of the site. Buttons, sizes, Join. Eyebrow words and category markers. Chapter headings. Page titles where they are not already display size.

3. Article 3

   Buch (400) is everything the skeleton carries. Body copy and leads. The contents of a record — artist, label, catalogue number, format, track, date. Every link, internal or out. Every credit. Meta, captions, chrome — and every display line, where size is the emphasis. Inside a row the voice never changes: the hierarchy there is size, and size alone. Japanese stays outside the argument: Cezanne has one real face, so we never reach for a bold that does not exist.

4. Article 4

   An exception must carry its reason. Written next to the declaration, in the stylesheet, at the moment it is made. A value without a reason is an accident, not a decision.

Weight says what stands; ink says what is chosen. A tab that is not the current one keeps its Halbfett but drops to the second ink, so the row reads as one set of choices with one of them taken.

In practice

• Top tab, controller bandHalbfett 600
• Button, size, JoinHalbfett 600
• Eyebrow, chapter headingHalbfett 600
• The wordmarkHalbfett 600
• Page title, hero, dateBuch 400
• Body, lead, record rowBuch 400
• Link, credit, metaBuch 400

Four rules decide every measurement on this site. Sizes are six steps, and nothing else exists. Leading is a short table, not a taste: 12/16, 14/16, 16/24, 24/32 — and from 40 up type is set solid. Every value is a multiple of eight. Tracking belongs to the small and to capitals: .08em at 14 and below, .02em for uppercase at 16 and above, 0 for lower-case reading — and it is never given where it would clip a line, because tracking exists to let letters breathe, not to delete them.

• 12 / 16Micro — labels, captions, credits, links out, the contents of a record, the small print
• 14 / 16Chrome — the working furniture of the site: the top tabs, the bands in the controller, prices, tracklists
• 16 / 24Reading — body copy, buttons, names that stand
• 24 / 32Chapters — section titles, category markers, leads
• 40Display — page titles, artist names, the NEXT PARTY date
• 80The wordmark — A.S.F. / A.S.F.RECS

Two of those steps are close together, so one line decides between them: chrome is 14, micro is 12. If it is furniture you steer the site with, it takes 14. If it is a note about something else — a caption, a credit, a link out, a line inside a record — it takes 12.

Written exceptions

Display descends one rung on a phone: 80 becomes 40, 40 becomes 24. One ladder, one step down, no new number. The party date does not descend — ten digits never wrap.

A single over-long cell in the chart may shrink below 12 to hold its line, down to a floor of 8 — one cell at a time, never the column. One long label must not decide the size of a column.

Japanese long-form sets its own size. Cezanne reads tighter than Latin at the same nominal pixel, so a Japanese paragraph takes the size and leading that make it readable rather than the rung it would inherit — today that is the two passages of Party Info.

A control that is only a glyph — × ‹ › ↗ — is set solid, so the mark sits in the centre of the thing you press. Its size still comes from the ladder.

Ink

Two tones of black and nothing between them. #000 carries meaning. rgba(0,0,0,.55) is the second rank — signatures, notes, muted meta. On solid black the paper white takes the same two ranks. Signal Orange is a single event per screen, never a colour scheme.

Every mark on the page means one thing, and it means it everywhere.

• Frame A border means you can press it. Nothing decorative is ever boxed.
• Rule A hairline divides. Lists and cards carry a top rule instead of a box.
• Arrow An arrow states position or direction. closed, open, ↗ leaves the site. Plus and minus are arithmetic, not opening and closing, so we do not use them.
• Lozenge The current choice inverts into solid black with a 2px radius, and it inverts instantly — no transition. A selected thing is a fact, not an animation.
• Radius Every solid-black rectangle takes the same 2px: buttons, the selected tab, and the bands inside the controller. Photographs, video letterboxing and round controls keep their own shape.

Void Black #0A0A0A. Paper White #F5F5F5. Surface Gray #EAEAEA — the footer ground. Signal Orange #FF5A1F — orange appears once per screen, never more. Hairlines at 15% and 35% black.

Everything sits on an 8px base grid inside a 1400px frame. Whitespace is part of the design — do not fill it.

For logo files, flyer assets or press inquiries: booking@asf3000.com