Typography

Font famaily is added using Google Fonts.

To modify the font family go to public/index.html and add your Google Font.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8" />
    <link rel="preconnect" href="https://fonts.gstatic.com" />
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
    <title>
      UI-demo | UI Kit by WebAngeles Agency.
    </title>
  </head>
  <body>

  </body>
</html>

For more information, please visit UI-Demo typography API.

Typography variants

body1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur

<Typography variant="body1">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>

body2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur

<Typography variant="body2">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
subtitle1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="subtitle1">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
subtitle2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="subtitle2">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
caption. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="caption">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
button. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="button">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
overline. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="overline">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
srOnly. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="srOnly">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
h6. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="h6">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>
h5. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
<Typography variant="h5">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>

h4. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur

<Typography variant="h4">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>

h3. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur

<Typography variant="h3">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>

h2. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur

<Typography variant="h2">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>

h1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur

<Typography variant="h1">
  Loipsum dolor sit amet, consectetur adipisicing elit. Quos blanditiis tenetur
</Typography>

© UI-demo. 2021, WebAngeles. All rights reserved

When you visit or interact with our sites, services or tools, we or our authorised service providers may use cookies for storing information to help provide you with a better, faster and safer experience and for marketing purposes.