Theme Serif

A theme style with serif font and diffrent colors (In compare of default style)

Example feature icon cards

Reusable elements

Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for layouts and visual mockups.

Learn More
Design & innovation

Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for layouts and visual mockups.

Learn More
Best selling

Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for layouts and visual mockups.

Learn More
Modern & organized

Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for layouts and visual mockups.

Learn More

Starter template

for Theme Serif


   <!doctype html>
   <html lang="en">
   <head>

    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- favicon -->
    <link rel="icon" href="assets/img/favicon.ico" type="image/ico">

    <!--Vendors Css-->
    <link rel="stylesheet" href="assets/fonts/boxicons/css/boxicons.min.css">
    <link href="assets/fonts/iconsmind/iconsmind.css" rel="stylesheet">
    <link href="assets/vendor/node_modules/css/aos.css" rel="stylesheet">

    <!-- Google fonts CSS -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Gloock&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">


    <!-- Bootstrap + vendor + theme CSS ///////////////////////////////-->
    <link href="assets/css/theme-serif.min.css" rel="stylesheet">
    <!--///////////////////////////////// [] ///////////////////////////////-->


    <!-- Add custom css -->
    <link href="assets/css/custom.css" rel="stylesheet">
    <title>Hello, world!</title>
    <head>
    <body>
                        
    <!--:main header -->
    <header>
      <nav class="navbar navbar-expand-lg navbar-light bg-white">
                                  
      </nav>
    </header>
                        
    <!--:main content -->
     <main>
     </main>
                        
    <!--:main Footer -->
    <footer>                     
    </footer>
                        
    <!-- Vendor + theme scripts -->
    <script src="assets/js/theme.bundle.js"></script>
    <!-- Add your custom scripts file -->
    <script src="assets/js/custom.js"></script>
   </body>
  </html>

Make an impact with design

There are combined alignment methods – when several types of alignment together are used in one composition.