BBC Global Experience Language vs GitHub Primer
BBC GEL / GitHub Primer
Both sit in Platform Screen Languages, so the question is not what they belong to but how they behave. They are reached for with some of the same intent, which is where they get confused.
BBC Global Experience Language
BBC's global experience language unifies news, video, audio and children's products through readable hierarchy, accessible media controls and reusable editorial components.
GitHub Primer
GitHub's design system for turning dense development workflows into shared rules for color, type, icons, spacing and components. It favors flow over decoration, keeping many states and actions in a small area without giving up accessibility or responsive behavior.
| BBC Global Experience Language | GitHub Primer | |
|---|---|---|
| Era | 2010– | 2017– |
| Family | Platform Screen Languages | Platform Screen Languages |
| Kind | Style | Style |
| Cues | Black header over white content / Short bold headlines / News cards with consistent image ratios / Highly visible focus, captions and playback controls | Neutral surfaces with blue links and restrained status colors / Octicons paired with short action labels / Thin borders separating lists, tabs and sidebars / Consistent steps of type and spacing even at high density |
| Best used for | Media sites mixing articles, audio and video · Delivering the same content across devices and assistive technology | Developer SaaS and admin tools that must hold many states and actions on one screen · Keeping information density and accessibility consistent across product teams |
| Type | Write short bold headlines and label content so it works without an image. | Use one plain sans for body and labels; build hierarchy through weight and color. |
| Composition | Keep card ratios consistent but let editorial importance change their size and order. | Separate lists, tabs and sidebars with fine rules and hold spacing to a small token set. |
| Material | Use black and white as the base, with one section or programme color. | Start from neutrals; reserve blue for links and semantic colors for success, warning and danger. |
| Caution | An even card grid erases editorial judgment. Express importance through area and sequence. | Adding borders and tiny controls to look like GitHub only creates a cramped admin screen when the work has no clear priority. |