tfl-components
DocsGet started with the component libraryBoard
DocsComponentsExplorerLabsBoard
⌘K
Star on GitHub

TfL Components is an independent project and is not affiliated with or endorsed by Transport for London.

Designed and built by MangleKuo.

About·Contact·Licence·Data and credits·Privacy·TfL metadata tracker·v0.7.0

1,031 visitors · 174 installs

tfl-components
DocsGet started with the component libraryBoard
DocsComponentsExplorerLabsBoard
⌘K
Star on GitHub
Get started
  • Get started
  • Components
  • Explorer
  • TypographyAbc
  • Colours
  • Roundel
Components
  • Tube & Rail Arrivals
  • Tube & Rail Status
  • Bus Arrivals
  • River bus arrivals
  • Cycle hire docks
  • Map – Tube & Rail (Geo)
  • Map – Bus (Geo)
  • Live Tube & Rail vehicles
  • Live buses
  • Simple line strip
  • Branch strip — horizontal
  • Branch strip — vertical
  • Station name labels
  • Platform chip
  • Bus number chip
  • Line title
  • Line chip
  • iPad wall display
  • Board URL
  • Troubleshoot
  • Data model
  • Line topology
  • TfL brand licensing
Primitives & Foundations
  • Icons & pictograms
v0.7.0

TfL Components is an independent project and is not affiliated with or endorsed by Transport for London.

Designed and built by MangleKuo.

About·Contact·Licence·Data and credits·Privacy·TfL metadata tracker·v0.7.0

1,031 visitors · 174 installs

Home / Labs

PreviousNext

Branch atlas

Compare horizontal and vertical diagrams for lines that split, join, and loop.

Some branches still need hand tuning. Awkward results belong in this atlas too.
Experimental
Direction
High Barnet
Totteridge & WhetstoneTotteridge and Whetstone
Woodside ParkWoodside Pk
West Finchley
Finchley CentralFinchley Ctrl
East Finchley
Highgate
Archway
Tufnell ParkTufnell Pk
Kentish
Town
Kentish Town
Mill Hill East
Edgware
Burnt Oak
Colindale
Hendon CentralHendon Ctrl
Brent Cross
Golders Green
Hampstead
Belsize ParkBelsize Pk
Chalk Farm
Camden Town
Mornington Crescent
Euston
Euston
King's Cross St. PancrasKings Cross St. PancrasKings Cross St PancrasKing Cross St PancrasKing's Cross Saint PancrasKings Cross Saint PancrasKing Cross Saint PancrasKing's X St. PancrasKing's X St Pancras
Angel
Old Street
Moorgate
Bank
London Bridge
Borough
Elephant
& Castle
Elephant & CastleElephant and Castle
Warren Street
Goodge Street
Tottenham Court RoadTottenham Court Rd
Leicester Square
Charing
Cross
Charing Cross
Embankment
Waterloo
Kennington
Oval
Stockwell
Clapham North
Clapham Common
Clapham South
Balham
Tooting Bec
Tooting Broadway
Colliers Wood
South Wimbledon
Morden
Nine Elms
Battersea Power

52

stations

7

branches

53

drawn nodes

  • High Barnet
  • Mill Hill East
  • Edgware
  • Bank
  • Charing Cross
  • Morden
  • Battersea

Reading the atlas

A station may need more than one drawn node where paths diverge and meet again. Horizontal and vertical diagrams use separate layouts, since rotating one rarely leaves readable labels.

Built withBranch strip — horizontalBranch strip — verticalStation name labels
Uses foundationsColours

Home / Labs

PreviousNext

Branch atlas

Compare horizontal and vertical diagrams for lines that split, join, and loop.

Some branches still need hand tuning. Awkward results belong in this atlas too.
Experimental
Direction
High Barnet
Totteridge & WhetstoneTotteridge and Whetstone
Woodside ParkWoodside Pk
West Finchley
Finchley CentralFinchley Ctrl
East Finchley
Highgate
Archway
Tufnell ParkTufnell Pk
Kentish
Town
Kentish Town
Mill Hill East
Edgware
Burnt Oak
Colindale
Hendon CentralHendon Ctrl
Brent Cross
Golders Green
Hampstead
Belsize ParkBelsize Pk
Chalk Farm
Camden Town
Mornington Crescent
Euston
Euston
King's Cross St. PancrasKings Cross St. PancrasKings Cross St PancrasKing Cross St PancrasKing's Cross Saint PancrasKings Cross Saint PancrasKing Cross Saint PancrasKing's X St. PancrasKing's X St Pancras
Angel
Old Street
Moorgate
Bank
London Bridge
Borough
Elephant
& Castle
Elephant & CastleElephant and Castle
Warren Street
Goodge Street
Tottenham Court RoadTottenham Court Rd
Leicester Square
Charing
Cross
Charing Cross
Embankment
Waterloo
Kennington
Oval
Stockwell
Clapham North
Clapham Common
Clapham South
Balham
Tooting Bec
Tooting Broadway
Colliers Wood
South Wimbledon
Morden
Nine Elms
Battersea Power

52

stations

7

branches

53

drawn nodes

  • High Barnet
  • Mill Hill East
  • Edgware
  • Bank
  • Charing Cross
  • Morden
  • Battersea

Reading the atlas

A station may need more than one drawn node where paths diverge and meet again. Horizontal and vertical diagrams use separate layouts, since rotating one rarely leaves readable labels.

Built withBranch strip — horizontalBranch strip — verticalStation name labels
Uses foundationsColours