tfl-style

less library containing all colours and fonts possible necessary for a TfL project

How to use

Install the npm package

npm install tfl-style --save

Create your own less file and reference the index less file of this project

import "./node_modules/tfl-style/_index.less"

reference the colours directly, or throught the colour and background classes (by using .#colour#-colour and .#colour#-background respectively)

.my-style{
    background: @corporate-blue;
}
.my-second-style{
    .corporate-blue-colour();
}
.my-third-style{
    .corporate-blue-background();
}

Colours included

Blue

@transport-for-london-blue

@corporate-blue

@piccadilly-blue

@london-underground-blue

@tfl-rail-blue

@oyster-dark-blue

@oyster-light-blue

@taxi-blue

@safety-blue

@victoria-blue

@river-services-blue

@legible-london-blue

Red

@corporate-red

@central-red

@london-buses-red

@emirates-airline-red

@santander-cycles-red

@congestion-charge-red

Yellow

@corporate-yellow

@circle-yellow

@legible-london-yellow

@london-coaches-yellow

Green

@corporate-green

@district-green

@tram-green

@low-emission-zone-green

Turquoise

@waterloo-and-city-turquoise

@dlr-turquoise

Pink

@hammersmith-and-city-pink

@transport-museum-pink

@visitor-centre-pink

@cycle-superhighway-pink

Magenta

@metropolitan-magenta

Purple

@elizabeth-purple

@dial-a-ride-purple

Orange

@overground-orange

Brown

@bakerloo-brown

White

@corporate-white

Grey

@corporate-grey

@jubilee-grey

@corporate-dark-grey

Black

@corporate-black

@northern-black