Typography

You are here:app / ui / typography

Genereal Typo

The Lato font will not be automatically loaded by Material-UI. The developer is responsible for loading all fonts used in their application. Lato Font has a few easy ways to get started.

Open Sans

Lorem ipsum dolor sit amet

Duis tristique metus magna, lobortis aliquam risus euismod sit amet.

Nullam in tortor ligula

Bolder Bold Semi Bold
Regular Light

Duis tristique metus magna, lobortis aliquam risus euismod sit amet. Suspendisse porttitor velit nisl, feugiat tincidunt nisl mattis ut. Nulla lobortis nunc vitae nisi semper semper.
Nulla eget lobortis lacus. Aliquam venenatis magna et odio lobortis maximus. Nullam in tortor ligula. Proin maximus risus nunc, eu aliquam nibh tempus a. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Vestibulum nec misuscipit

Bolder Bold Semi Bold Regular Light

Vestibulum faucibus eget erat eget pretium. Donec commodo convallis ligula, eget suscipit orci. Suspendisse potenti.
Curabitur egestas consequat lorem, vel fermentum augue porta id. Aliquam lobortis magna neque, gravida consequat velit venenatis at. Duis sed augue leo. Phasellus ante massa, aliquam non ante at, suscipit ornare ipsum. Quisque a consequat ante, at volutpat enim.

Numberslooks great! 1234567890

Let your Creativity Flow 123^$

Numerics 123⁰⁰

Body 2

Body 1

Caption

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Button

src/app/containers/UiElements/demos/Typography/GeneralTypo.js

Text Alignment

Align center: Nullam in tortor ligula

Align Left

Align Right

Justify Align

Vestibulum faucibus eget erat eget pretium. Donec commodo convallis ligula, eget suscipit orci. Suspendisse potenti. Nulla eget lobortis lacus. Aliquam venenatis magna et odio lobortis maximus. Nullam in tortor ligula. Proin maximus risus nunc, eu aliquam nibh tempus a. Interdum et malesuada fames ac ante ipsum primis in faucibus.

src/app/containers/UiElements/demos/Typography/AlignTypo.js

Coloured Text

Ut sed eros finibus

Nulla eget lobortis lacus. Aliquam venenatis magna et odio lobortis maximus.

Aliquam nec ex aliquet

Aenean facilisis vitae purus facilisis semper

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sed urna in justo euismod condimentum.

Vivamus et luctus mauris. Maecenas nisl libero, tincidunt id odio id, feugiat vulputate quam.

Curabitur egestas consequat lorem, vel fermentum augue porta id.

src/app/containers/UiElements/demos/Typography/ColouredTypo.js

Heading

Disp 4

Display 3

Display 2

Display 1

Headline

Title

Subheading