Design tokens
The same values as the site's stylesheet, read from it at build time.
Show all tokens
name: FRAME
url: https://propagandaarchive.org/
updated: 2026-10-20
standard_followed: https://llmbestpractices.com
fonts:
heading: Inter
body: Inter
mono: IBM Plex Mono
colors:
light:
paper: '#f7f5f0'
paper-2: '#efece4'
mount: '#d9d9d6'
ink: '#0b0b0b'
ink-2: '#4a4a4a'
muted: '#6f6f6f'
rule: '#dcdad4'
accent: '#c8102e'
logo-red: '#e30613'
accent-ink: '#ffffff'
gray-badge: '#4a4a4a'
dark:
paper: '#0b0b0b'
paper-2: '#161615'
mount: '#262625'
ink: '#f7f5f0'
ink-2: '#d9d9d6'
muted: '#9a9a98'
rule: '#2e2e2c'
accent: '#e14a5f'
logo-red: '#e30613'
accent-ink: '#0b0b0b'
gray-badge: '#9a9a98'
logo: https://propagandaarchive.org/static/frame-logo-ink.svg
logo_on_dark: https://propagandaarchive.org/static/frame-logo.svg
favicon: https://propagandaarchive.org/static/favicon.svg
og_image: https://propagandaarchive.org/static/generated/share-default.jpg
Logo
The logo is the word FRAME inside four red corner brackets, with the full name, Forensic Research Archive of Manipulation and Exploitation, in spaced capitals beneath it and a short red rule under that. The lettering is Barlow Condensed ExtraBold (FRAME) and Barlow SemiBold (the full name), both under the SIL Open Font License 1.1, converted to outlines so no font file is needed. In the site header the brackets and FRAME are drawn as a vector and the full name beside them is ordinary text. Use the ink-text logo on light backgrounds and the white-text logo on dark ones; the brackets stay red (#e30613) on both. Do not recolour it.
Keep clear space around the logo equal to the height of its letters, so nothing sits closer than that to the brackets. Inside the brackets the letters keep a gap of about half their height on the sides and top and bottom. In the header the logo is 2.9 rem tall (2.4 rem on phones); do not show the full lockup narrower than 160 px.
Logo, ink text (SVG) · Logo, white text (SVG) · Bracket mark, ink (SVG) · Bracket mark, ivory (SVG)
Favicon
The favicon is red brackets around a white F on an ink tile, a 32 × 32 SVG declared in every page head as <link rel="icon" type="image/svg+xml">. PNG versions serve the Apple touch icon and the web manifest. favicon.svg · apple-touch-icon.png · icon-192.png · icon-512.png
Color palette
| Token | Light | Dark | Role |
|---|---|---|---|
paper | #f7f5f0 | #0b0b0b | Page background |
paper-2 | #efece4 | #161615 | Footer and quiet panels |
mount | #d9d9d6 | #262625 | Poster mounts and content-note panels |
ink | #0b0b0b | #f7f5f0 | Body text and headings |
ink-2 | #4a4a4a | #d9d9d6 | Secondary text |
muted | #6f6f6f | #9a9a98 | Captions and labels |
rule | #dcdad4 | #2e2e2c | Dividers and borders |
accent | #c8102e | #e14a5f | Evidence red: links, buttons and the content-note bar |
logo-red | #e30613 | #e30613 | Logo brackets and rule (the same red in both themes) |
accent-ink | #ffffff | #0b0b0b | Text on the accent colour |
gray-badge | #4a4a4a | #9a9a98 | Gray-source badge |
Typography
Headings and body text use Inter, with the system UI font as the fallback. Labels and tags use IBM Plex Mono, falling back to the system monospace font. The full name beside the logo in the header is set in the body font, semibold capitals with wide letter-spacing. The site loads no web fonts, so each visitor sees Inter or IBM Plex Mono only if it is installed on their device.
| Role | Family | Fallback |
|---|---|---|
| Headings and body | Inter | -apple-system, Segoe UI, system-ui, Helvetica Neue, Arial |
| Labels and tags | IBM Plex Mono | ui-monospace, SFMono-Regular, Menlo, Consolas |
Media assets
The AI-generated images below are illustrations, not archive objects, and each is labelled as such. The site uses them as page heroes, as in-body section breaks that reuse a hero, as the link-share image, on technique cards, and as site graphics (section breaks and spot graphics in the same style as the heroes). None depicts a real, identifiable person, a real flag or a real artefact, and none counts toward the real-image requirement on a page. The technique-card images are named for their technique id: static/generated/technique-cards/<technique-id>.jpg. Archive images (posters, cartoons, documents) are not brand assets; each object page states its source and rights.
Section and page heroes
One per section index page, plus the home page and the link-share image. Where a hero is reused, each page that shows it is listed.

Used on: Campaigns, Elections/us presidential, Regimes Illustration, not an archive object

Used on: Case studies, Presentations Illustration, not an archive object

Used on: Collection Illustration, not an archive object

Used on: Home Illustration, not an archive object

Used on: Learn Illustration, not an archive object

Used on: Technique map, Map and timeline Illustration, not an archive object

Used on: Techniques Illustration, not an archive object

Used on: Then and now Illustration, not an archive object

Used on: Watch briefs Illustration, not an archive object

Used on: Write Illustration, not an archive object

Detail-page heroes
A pool of heroes for individual pages (technique, case-study, campaign, brief, Learn and Write pages). Each page draws one from the pool, matched to its era where it has one.



Used on: About Illustration, not an archive object





Technique cards










































Site graphics: wide
23 wide (21:9) illustrations for section breaks and full-width bands anywhere on the site. Every long page shows one as a section break, the one whose topics best match the page's subject, so a page always gets the same image.























Site graphics: spot
12 square illustrations with an aged-paper border, floated beside a later section on pages over 3,000 words.












Downloads
All 62 files with format, size and link
| File | Format | Size | Download |
|---|---|---|---|
| Logo, ink text (for light backgrounds) | SVG | vector | static/frame-logo-ink.svg |
| Logo, white text (for dark backgrounds) | SVG | vector | static/frame-logo.svg |
| Frame mark, ink | SVG | 32 × 32 viewBox | static/frame-mark.svg |
| Frame mark, ivory (for dark backgrounds) | SVG | 32 × 32 viewBox | static/frame-mark-ivory.svg |
| Favicon | SVG | 32 × 32 viewBox | static/favicon.svg |
| Apple touch icon | PNG | 180 × 180 | static/apple-touch-icon.png |
| App icon 192 | PNG | 192 × 192 | static/icon-192.png |
| App icon 512 | PNG | 512 × 512 | static/icon-512.png |
| Page hero: campaigns | JPEG | 2688 × 1152 | static/generated/hero-campaigns.jpg |
| Page hero: case-studies | JPEG | 2688 × 1152 | static/generated/hero-case-studies.jpg |
| Page hero: collection | JPEG | 2688 × 1152 | static/generated/hero-collection.jpg |
| Page hero: home | JPEG | 2688 × 1152 | static/generated/hero-home.jpg |
| Page hero: learn | JPEG | 2688 × 1152 | static/generated/hero-learn.jpg |
| Page hero: map | JPEG | 2688 × 1152 | static/generated/hero-map.jpg |
| Page hero: techniques | JPEG | 2688 × 1152 | static/generated/hero-techniques.jpg |
| Page hero: then-and-now | JPEG | 2688 × 1152 | static/generated/hero-then-and-now.jpg |
| Page hero: watch-briefs | JPEG | 2688 × 1152 | static/generated/hero-watch-briefs.jpg |
| Page hero: write | JPEG | 2688 × 1152 | static/generated/hero-write.jpg |
| Link-share image | JPEG | 1200 × 630 | static/generated/share-default.jpg |
| Detail-page hero: cold-war-global-south | JPEG | 2688 × 1152 | static/generated/detail/hero-cold-war-global-south.jpg |
| Detail-page hero: contemporary-evidence-wall | JPEG | 2688 × 1152 | static/generated/detail/hero-contemporary-evidence-wall.jpg |
| Detail-page hero: evidence-wall | JPEG | 2688 × 1152 | static/generated/detail/hero-evidence-wall.jpg |
| Detail-page hero: interwar | JPEG | 2688 × 1152 | static/generated/detail/hero-interwar.jpg |
| Detail-page hero: map-heavy | JPEG | 2688 × 1152 | static/generated/detail/hero-map-heavy.jpg |
| Detail-page hero: pre1914 | JPEG | 2688 × 1152 | static/generated/detail/hero-pre1914.jpg |
| Detail-page hero: wwi | JPEG | 2688 × 1152 | static/generated/detail/hero-wwi.jpg |
| Detail-page hero: wwii-pacific | JPEG | 2688 × 1152 | static/generated/detail/hero-wwii-pacific.jpg |
| Site graphic (wide): tape console | JPEG | 1920 × 823 | static/generated/graphics/tape-console.jpg |
| Site graphic (wide): shortwave hall | JPEG | 1920 × 823 | static/generated/graphics/shortwave-hall.jpg |
| Site graphic (wide): printing press | JPEG | 1920 × 823 | static/generated/graphics/printing-press.jpg |
| Site graphic (wide): rooftop loudspeakers | JPEG | 1920 × 823 | static/generated/graphics/rooftop-loudspeakers.jpg |
| Site graphic (wide): teleprinter office | JPEG | 1920 × 823 | static/generated/graphics/teleprinter-office.jpg |
| Site graphic (wide): front pages | JPEG | 1920 × 823 | static/generated/graphics/front-pages.jpg |
| Site graphic (wide): leaflet drop | JPEG | 1920 × 823 | static/generated/graphics/leaflet-drop.jpg |
| Site graphic (wide): rally silhouettes | JPEG | 1920 × 823 | static/generated/graphics/rally-silhouettes.jpg |
| Site graphic (wide): censors desk | JPEG | 1920 × 823 | static/generated/graphics/censors-desk.jpg |
| Site graphic (wide): cipher machine | JPEG | 1920 × 823 | static/generated/graphics/cipher-machine.jpg |
| Site graphic (wide): microfilm archive | JPEG | 1920 × 823 | static/generated/graphics/microfilm-archive.jpg |
| Site graphic (wide): newsreel projector | JPEG | 1920 × 823 | static/generated/graphics/newsreel-projector.jpg |
| Site graphic (wide): reading room | JPEG | 1920 × 823 | static/generated/graphics/reading-room.jpg |
| Site graphic (wide): map table | JPEG | 1920 × 823 | static/generated/graphics/map-table.jpg |
| Site graphic (wide): stamp wall | JPEG | 1920 × 823 | static/generated/graphics/stamp-wall.jpg |
| Site graphic (wide): darkroom retouching | JPEG | 1920 × 823 | static/generated/graphics/darkroom-retouching.jpg |
| Site graphic (wide): lithography workshop | JPEG | 1920 × 823 | static/generated/graphics/lithography-workshop.jpg |
| Site graphic (wide): tv control room | JPEG | 1920 × 823 | static/generated/graphics/tv-control-room.jpg |
| Site graphic (wide): evidence wall posts | JPEG | 1920 × 823 | static/generated/graphics/evidence-wall-posts.jpg |
| Site graphic (wide): switchboard | JPEG | 1920 × 823 | static/generated/graphics/switchboard.jpg |
| Site graphic (wide): postal sorting | JPEG | 1920 × 823 | static/generated/graphics/postal-sorting.jpg |
| Site graphic (wide): empty podium | JPEG | 1920 × 823 | static/generated/graphics/empty-podium.jpg |
| Site graphic (wide): jamming station | JPEG | 1920 × 823 | static/generated/graphics/jamming-station.jpg |
| Site graphic (spot): stamp and pad | JPEG | 1024 × 1024 | static/generated/graphics/spot-stamp-and-pad.jpg |
| Site graphic (spot): typewriter keys | JPEG | 1024 × 1024 | static/generated/graphics/spot-typewriter-keys.jpg |
| Site graphic (spot): halftone loupe | JPEG | 1024 × 1024 | static/generated/graphics/spot-halftone-loupe.jpg |
| Site graphic (spot): film spool | JPEG | 1024 × 1024 | static/generated/graphics/spot-film-spool.jpg |
| Site graphic (spot): redacted page | JPEG | 1024 × 1024 | static/generated/graphics/spot-redacted-page.jpg |
| Site graphic (spot): megaphone | JPEG | 1024 × 1024 | static/generated/graphics/spot-megaphone.jpg |
| Site graphic (spot): microphone | JPEG | 1024 × 1024 | static/generated/graphics/spot-microphone.jpg |
| Site graphic (spot): compass map | JPEG | 1024 × 1024 | static/generated/graphics/spot-compass-map.jpg |
| Site graphic (spot): sealed envelope | JPEG | 1024 × 1024 | static/generated/graphics/spot-sealed-envelope.jpg |
| Site graphic (spot): shredded strips | JPEG | 1024 × 1024 | static/generated/graphics/spot-shredded-strips.jpg |
| Site graphic (spot): radio dial | JPEG | 1024 × 1024 | static/generated/graphics/spot-radio-dial.jpg |
| Site graphic (spot): keyhole lens | JPEG | 1024 × 1024 | static/generated/graphics/spot-keyhole-lens.jpg |
This page follows the LLM-discoverability standard at https://llmbestpractices.com.