bulma-greyp

A simple page showcasing Bulma elements with the standard greyp color palette.

Typography


Title size 1

Title size 2

Title size 3

Title size 4

Title size 5
Title size 6

Subtitle size 1

Subtitle size 2

Subtitle size 3

Subtitle size 4

Subtitle size 5
Subtitle size 6

Title size 1

Subtitle size 3

Title size 2

Subtitle size 4

Title size 3

Subtitle size 5

Standard title

Standard subtitle

Slightly darker main titles, strong text and black hyperlinks.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque risus mi, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum felis venenatis efficitur. Aenean ac eleifend lacus, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.

Colors


The entire point of greyp is to speed up the design process by removing colors, and to focus on layout and positioning instead of fretting over colors.

Error: Complete form to register new user

Registration

Valid email

This field is required

Other modifications


In addition to changes to typography and colors, the following variables has been tweaked slightly. These changes are personal preference only, and easy to reset.

$dark
Set to $black-bis instead of $grey-darker.
$radius-large
Radius on boxes. Set to 4px, same radius as buttons.
$box-shadow
Slightly softer shadows.
$box-padding
Slight increase to allow for more space when using tabs inside boxes.