CINXE.COM
Landwind - Tailwind CSS Landing Page - Themesberg
<!doctype html> <html lang="en"> <head> <link rel="canonical" href="https://themesberg.com/product/tailwind-css/landing-page"> <title>Landwind - Tailwind CSS Landing Page - Themesberg</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content="Free and open-source landing page built for Tailwind CSS featuring a responsive layout, hero section, pricing cards, FAQ sections, feature sections and dark mode. Check the live demo and join over 89371 developers using our products."> <meta name="author" content="Themesberg"> <meta name="csrf-token" content="W712TGeDdLk8WBYjhAWMuVHaBzaP1F09B4jZZpyU"> <meta name="image" content="https://themesberg.s3.us-east-2.amazonaws.com/public/products/landwind/landwind-thumbnail.jpg"> <meta name=”robots” content="index, follow"> <meta name="twitter:title" content="Landwind - Tailwind CSS Landing Page"> <meta name="twitter:url" content="https://themesberg.com/product/tailwind-css/landing-page"> <meta name="twitter:description" content="Free and open-source landing page built for Tailwind CSS featuring a responsive layout, hero section, pricing cards, FAQ sections, feature sections and dark mode. Check the live demo and join over 89371 developers using our products."> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@themesberg"> <meta name="twitter:creator" content="@themesberg"> <meta name="twitter:image" content="https://themesberg.s3.us-east-2.amazonaws.com/public/products/landwind/landwind-thumbnail.jpg"> <meta property="og:type" content="og:product" /> <meta property="og:title" content="Landwind - Tailwind CSS Landing Page"> <meta property="og:description" content="Free and open-source landing page built for Tailwind CSS featuring a responsive layout, hero section, pricing cards, FAQ sections, feature sections and dark mode."> <meta property="og:url" content="https://themesberg.com/product/tailwind-css/landing-page"> <meta property="og:image" content="https://themesberg.s3.us-east-2.amazonaws.com/public/products/landwind/landwind-thumbnail.jpg"> <meta property="product:brand" content="Themesberg"> <meta property="product:availability" content="in stock"> <meta property="product:condition" content="new"> <meta property="product:price:amount" content="0"> <meta property="product:price:currency" content="USD"> <meta property="product:retailer_item_id" content="landing-page"> <meta property="product:item_group_id" content="tailwind-css_landing-page"> <meta property="fb:app_id" content="2440134909584662" /> <link rel="apple-touch-icon" sizes="180x180" href="https://themesberg.com/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="https://themesberg.com/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="https://themesberg.com/favicon-16x16.png"> <link rel="manifest" href="https://themesberg.com/site.webmanifest"> <link rel="mask-icon" href="https://themesberg.com/safari-pinned-tab.svg" color="#ff7f66"> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="theme-color" content="#ffffff"> <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,600,700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-rqn26AG5Pj86AF4SO72RK5fyefcQ/x32DNQfChxWvbXIyXFePlEktwD18fEz+kQU" crossorigin="anonymous"> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css" /> <link type="text/css" href="https://themesberg.com/css/themesberg.css" rel="stylesheet"> <script src="https://cdn.usefathom.com/script.js" data-site="ZLGNUJDJ" defer></script> </head> <body> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-THQTXJ7" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <header> <nav class="navbar navbar-expand-lg navbar-light bg-soft navbar-light"> <div class="container"> <a class="navbar-brand mr-lg-4" href="https://themesberg.com"> <div class="d-flex align-items-center"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 54 64"> <defs> <style> .class-1 { fill: #ff7f66; } .class-2, .class-4 { fill: #2a344f; } .class-2 { opacity: 0.32; isolation: isolate; } .class-3 { opacity: 0.16; } </style> </defs> <title>logo</title> <g id="Layer_2" data-name="Layer 2"> <g id="Layer_1-2" data-name="Layer 1"> <g id="Group_16" data-name="Group 16"> <g id="Group_15" data-name="Group 15"> <g id="Group_12" data-name="Group 12"> <path id="Path_35" data-name="Path 35" class="class-1" d="M53.52,1.87l-22,5.39a1.61,1.61,0,0,1-1.23-.21L19.89.25a1.57,1.57,0,0,0-1.3-.19l-18,5.3A.77.77,0,0,0,0,6.09V16.87L18.59,11.4a1.57,1.57,0,0,1,1.3.19l10.4,6.79a1.53,1.53,0,0,0,1.23.21L54,13.09V2.23a.39.39,0,0,0-.39-.38Z" /> <path id="Path_36" data-name="Path 36" class="class-1" d="M40.25,27.84l-8.73,2.1a1.57,1.57,0,0,1-1.23-.21l-10.4-6.8a.37.37,0,0,0-.53.11.31.31,0,0,0-.07.2V33.47a.75.75,0,0,0,.34.63l10.66,7a1.57,1.57,0,0,0,1.23.2l9.23-2.21A6.86,6.86,0,0,0,46,32.45v-.21a4.62,4.62,0,0,0-4.68-4.55A4.93,4.93,0,0,0,40.25,27.84Z" /> <path id="Path_37" data-name="Path 37" class="class-1" d="M40.25,50.52l-8.73,2.1a1.61,1.61,0,0,1-1.23-.21l-10.4-6.8a.38.38,0,0,0-.53.1.35.35,0,0,0-.07.21V56.15a.75.75,0,0,0,.34.63l10.66,7a1.53,1.53,0,0,0,1.23.21l9.23-2.22A6.84,6.84,0,0,0,46,55.13v-.21a4.62,4.62,0,0,0-4.68-4.55A4.39,4.39,0,0,0,40.25,50.52Z" /> </g> <path id="Path_38" data-name="Path 38" class="class-2" d="M30.86,41.29V30a1.63,1.63,0,0,0,.66,0L35.28,29l2.2,10.8-6,1.46A1.47,1.47,0,0,1,30.86,41.29Zm8.82,9.33-8.16,2a1.63,1.63,0,0,1-.66,0V64a1.63,1.63,0,0,0,.66,0l10.36-2.54Zm-8.82-32a1.63,1.63,0,0,0,.66,0l1.57-.38L30.86,7.28Z" /> <g id="Group_13" data-name="Group 13" class="class-3"> <path id="Path_39" data-name="Path 39" class="class-4" d="M19.29,11.36a1.82,1.82,0,0,1,.6.23l10.4,6.8a1.41,1.41,0,0,0,.57.22V7.27a1.41,1.41,0,0,1-.57-.22L19.89.25a1.82,1.82,0,0,0-.6-.23Z" /> <path id="Path_40" data-name="Path 40" class="class-4" d="M30.86,52.64a1.67,1.67,0,0,1-.57-.23l-10.4-6.8a.39.39,0,0,0-.54.11.36.36,0,0,0-.06.2V56.15a.75.75,0,0,0,.34.63l10.66,7a1.73,1.73,0,0,0,.57.22Z" /> <path id="Path_41" data-name="Path 41" class="class-4" d="M19.89,22.93a.39.39,0,0,0-.54.11.36.36,0,0,0-.06.2V33.47a.75.75,0,0,0,.34.63l10.66,7a1.58,1.58,0,0,0,.57.22V30a1.43,1.43,0,0,1-.57-.23Z" /> </g> </g> </g> </g> </g> </svg> <p class="ml-2 mb-0 logo-text "> Themesberg</p> </div> </a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse pt-3 pt-lg-0" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <li class="nav-item"> <a href="https://themesberg.com/themes" class="nav-link">Themes</a> </li> <li class="nav-item"> <a href="https://themesberg.com/blog" class="nav-link">Blog</a> </li> <li class="nav-item"> <a href="https://themesberg.com/contact" class="nav-link">Contact</a> </li> </ul> <div class="d-flex align-items-center"> <div class="d-flex align-items-center"> <a href="https://themesberg.com/login" class="btn btn-sm btn-outline-primary mt-2 mt-lg-0" data-toggle="tooltip" data-placement="bottom" title="Join 89371 developers to access Free Themes"> <i class="fad fa-sign-in-alt mr-2"></i>Login/Register </a> </div> </div> </div> </div> </nav> </header> <nav class="navbar navbar-product navbar-expand-lg navbar-light bg-soft navbar-light" style="display: none"> <div class="container"> <a class="navbar-brand mr-lg-4" href="https://themesberg.com"> <div class="d-flex align-items-center"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 54 64"> <defs> <style> .class-1 { fill: #ff7f66; } .class-2, .class-4 { fill: #2a344f; } .class-2 { opacity: 0.32; isolation: isolate; } .class-3 { opacity: 0.16; } </style> </defs> <title>logo</title> <g id="Layer_2" data-name="Layer 2"> <g id="Layer_1-2" data-name="Layer 1"> <g id="Group_16" data-name="Group 16"> <g id="Group_15" data-name="Group 15"> <g id="Group_12" data-name="Group 12"> <path id="Path_35" data-name="Path 35" class="class-1" d="M53.52,1.87l-22,5.39a1.61,1.61,0,0,1-1.23-.21L19.89.25a1.57,1.57,0,0,0-1.3-.19l-18,5.3A.77.77,0,0,0,0,6.09V16.87L18.59,11.4a1.57,1.57,0,0,1,1.3.19l10.4,6.79a1.53,1.53,0,0,0,1.23.21L54,13.09V2.23a.39.39,0,0,0-.39-.38Z" /> <path id="Path_36" data-name="Path 36" class="class-1" d="M40.25,27.84l-8.73,2.1a1.57,1.57,0,0,1-1.23-.21l-10.4-6.8a.37.37,0,0,0-.53.11.31.31,0,0,0-.07.2V33.47a.75.75,0,0,0,.34.63l10.66,7a1.57,1.57,0,0,0,1.23.2l9.23-2.21A6.86,6.86,0,0,0,46,32.45v-.21a4.62,4.62,0,0,0-4.68-4.55A4.93,4.93,0,0,0,40.25,27.84Z" /> <path id="Path_37" data-name="Path 37" class="class-1" d="M40.25,50.52l-8.73,2.1a1.61,1.61,0,0,1-1.23-.21l-10.4-6.8a.38.38,0,0,0-.53.1.35.35,0,0,0-.07.21V56.15a.75.75,0,0,0,.34.63l10.66,7a1.53,1.53,0,0,0,1.23.21l9.23-2.22A6.84,6.84,0,0,0,46,55.13v-.21a4.62,4.62,0,0,0-4.68-4.55A4.39,4.39,0,0,0,40.25,50.52Z" /> </g> <path id="Path_38" data-name="Path 38" class="class-2" d="M30.86,41.29V30a1.63,1.63,0,0,0,.66,0L35.28,29l2.2,10.8-6,1.46A1.47,1.47,0,0,1,30.86,41.29Zm8.82,9.33-8.16,2a1.63,1.63,0,0,1-.66,0V64a1.63,1.63,0,0,0,.66,0l10.36-2.54Zm-8.82-32a1.63,1.63,0,0,0,.66,0l1.57-.38L30.86,7.28Z" /> <g id="Group_13" data-name="Group 13" class="class-3"> <path id="Path_39" data-name="Path 39" class="class-4" d="M19.29,11.36a1.82,1.82,0,0,1,.6.23l10.4,6.8a1.41,1.41,0,0,0,.57.22V7.27a1.41,1.41,0,0,1-.57-.22L19.89.25a1.82,1.82,0,0,0-.6-.23Z" /> <path id="Path_40" data-name="Path 40" class="class-4" d="M30.86,52.64a1.67,1.67,0,0,1-.57-.23l-10.4-6.8a.39.39,0,0,0-.54.11.36.36,0,0,0-.06.2V56.15a.75.75,0,0,0,.34.63l10.66,7a1.73,1.73,0,0,0,.57.22Z" /> <path id="Path_41" data-name="Path 41" class="class-4" d="M19.89,22.93a.39.39,0,0,0-.54.11.36.36,0,0,0-.06.2V33.47a.75.75,0,0,0,.34.63l10.66,7a1.58,1.58,0,0,0,.57.22V30a1.43,1.43,0,0,1-.57-.23Z" /> </g> </g> </g> </g> </g> </svg> <p class="ml-2 mb-0 logo-text "> Themesberg</p> </div> </a> <div class="d-flex flex-wrap"> <a href="https://demo.themesberg.com/landwind/" target="_blank" rel="nofollow noopener" class="btn btn-sm btn-dark animate-up-2 mr-3" style="background: #4E00D3; border-color: #4E00D3 !important"> Live preview <span class="fad fa-external-link ml-2"></span> </a> <a href="https://themesberg.com/register" role="button" class="btn btn-sm btn-dark animate-up-2 mr-3 d-none d-md-inline" data-toggle="tooltip" data-placement="top" title="Please sign up or login before you can download" data-original-title="Please sign up or login before you can download"><i class="fad fa-download mr-2"></i>Download</a> <a href="https://github.com/themesberg/landwind" target="_blank" role="button" class="btn btn-gray animate-up-2 btn-sm d-none d-md-inline"> <span class="btn-inner-text"><span class="far fa-books mr-2"></span> Docs v1.0.0</span> </a> </div> </div> </nav> <main> <div itemscope itemtype="https://schema.org/Product"> <section class="section section-xl pt-lg-5 pt-3 pb-lg-7 bg-soft o-hidden justify-content-center position-relative"> <div class="container"> <div class="row justify-content-between align-items-center"> <div class="col-12 col-lg-7 mb-5 mb-lg-0"> <nav aria-label="breadcrumb"> <ol class="breadcrumb breadcrumb-gray breadcrumb-product text-dark breadcrumb-transparent mb-3"> <li class="breadcrumb-item"><a href="https://themesberg.com/themes">Themes</a></li> <li class="breadcrumb-item "><a href="https://themesberg.com/templates/tailwind-css">Tailwind CSS</a> </li> <li class="breadcrumb-item active" aria-current="page">Landwind Tailwind CS</li> </ol> </nav> <h1 class="mb-2 h2" itemprop="name">Landwind - Tailwind CSS Landing Page</h1> <p class="mb-4 text-md font-weight-light">Free Tailwind CSS landing page built with Flowbite</p><span class="d-none" itemprop="sku">28</span> <div class="d-flex"> <a class="d-flex justify-content-center" href="#reviews" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> <span class="d-flex justify-content-center mb-2"> <i class="star fa-star fas text-warning mr-2"> </i> <i class="star fa-star fas text-warning mr-2"> </i> <i class="star fa-star fas text-warning mr-2"> </i> <i class="star fa-star fas text-warning mr-2"> </i> <i class="star fa-star fas text-warning "> </i> </span> <span class="text-sm text-gray-700 ml-2"><span class="font-weight-normal"><span itemprop="ratingValue">5.0</span> out of 5</span> (<span itemprop="reviewCount">1</span> Reviews)</span> </a> </div> <div class="mt-4"> <a href="https://demo.themesberg.com/landwind/" target="_blank" rel="nofollow noopener" class="btn btn-dark animate-up-2 mr-3" style="background: #4E00D3; border-color: #4E00D3 !important"> Live preview <span class="fad fa-external-link ml-2"></span> </a> <a href="https://themesberg.com/register" role="button" class="btn btn-dark animate-up-2" data-toggle="tooltip" data-placement="top" title="Please sign up or login before you can download" data-original-title="Please sign up or login before you can download"><i class="fad fa-download mr-2"></i>Download</a> </div> </div> <div class="col-12 col-lg-5 mb-4 mb-lg-0"> <div class="product-card product-card-main show-info card shadow-xl border-0 mb-0" data-product-color="#4E00D3"> <div class="card border-0 bg-transparent"> <a href="https://demo.themesberg.com/landwind/" rel="noopener nofollow" target="_blank"> <figure> <img src="https://themesberg.s3.us-east-2.amazonaws.com/public/products/landwind/landwind-thumbnail.jpg" class="card-img-top rounded-md" alt="Landwind - Tailwind CSS Landing Page Preview" itemprop="image"> <figcaption class="show-on-hover"> <span class="btn btn-tertiary px-4" style="background: #4E00D3; border-color: #4E00D3 !important"> <span class="btn-inner-text">Live preview</span> </span> </figcaption> </figure> </a> </div> </div> </div> </div> </div> </section> <div class="section pt-4 pt-xl-0"> <div class="container mt-n5"> <nav class="mb-lg-6 mb-5"> <div class="nav nav-tabs flex-column flex-md-row shadow-sm border-soft justify-content-around bg-white rounded py-4" id="nav-tab" role="tablist"> <a class="nav-item nav-link" href="#overview"> <span class="fad fa-file-alt mr-2"></span>Overview </a> <a class="nav-item nav-link" href="#reviews"> <span class="fad fa-comment-lines mr-2"></span>Reviews </a> <a class="nav-item nav-link" href="#changelog"> <span class="fad fa-clipboard-list mr-2"></span>Changelog </a> </div> </nav> <div class="row justify-content-between" id="overview"> <div class="col-12 col-xl-7 product-description mb-4 mb-lg-0 read-more " id="product-description" itemprop="description"> <article> <p>Landwind is a free and open-source landing page built with the utility-first Tailwind CSS framework and based on the Flowbite component library featuring responsive layout, hero sections, pricing cards, FAQ sections and dark mode.</p> <h2>Build with Tailwind CSS</h2> <p>This template is based on the most popular utility-first framework called Tailwind CSS and it uses the components from Flowbite such as the buttons, typography, navbar, and more.</p> <p>The sections are part of the <a href="https://flowbite.com/blocks/">Flowbite Blocks System</a> which is a collection of over 150+ website sections based on the Tailwind CSS framework including hero sections, footers, headers, CTA sections, and more.</p> <p>Check out the <a href="https://github.com/themesberg/landwind">GitHub repo</a> of this project to learn how to get started with this template and plug it in inside a Tailwind CSS and Flowbite project.</p> <h2>Flowbite components</h2> <p>The components used on this page such as the buttons, navigation bar, footers are from the open-source <a href="https://flowbite.com/docs/getting-started/introduction/">Tailwind CSS component library called Flowbite</a>.</p> <h2>Example pages</h2> <p>This project includes on example page that you can use right away for any SaaS or product oriented website and increase conversions with the pricing cards and the pre-footer CTA section.</p> <p>You can check out a live demo directly from here: <a href="https://demo.themesberg.com/landwind/">live demo</a>.</p> <h2>Figma design file</h2> <p>This landing page template also has a Figma design file that you can easily duplicate from the Figma community website by clicking here: <a href="https://www.figma.com/community/file/1125744163617429490">Landwind - Figma landing page</a>.</p> <h2>Credits</h2> <p>This project uses open-source software such as Tailwind CSS and Flowbite:</p> <ul> <li> <a href="https://tailwind.css.com">Tailwind CSS</a> </li> <li> <a href="https://flowbite.com">Flowbite</a> </li> <li> <a href="https://flowbite.com/blocks/">Flowbite Blocks</a> </li> </ul> </article> <span class="toggle-read-more" data-target="#product-description">Read more <i class="fad fa-chevron-circle-down ml-1"></i></span> </div> <div class="col-12 col-xl-4 mt-3 mt-lg-0"> <ul class="d-flex justify-content-center list-style-none mb-4"> <li><a href="https://themesberg.com/templates/tailwind-css" class="btn btn-xl mb-2 mr-3 btn-icon-only rounded-circle btn-white" data-toggle="tooltip" title="Built with Tailwind CSS - World's most popular utility-first CSS framework"> <svg class="btn-inner-icon" height="24" preserveAspectRatio="xMidYMid" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 153.6"><linearGradient id="a" x1="-2.778%" y1="32%" y2="67.556%"><stop offset="0" stop-color="#2298bd"/><stop offset="1" stop-color="#0ed7b5"/></linearGradient><path d="M128 0C93.867 0 72.533 17.067 64 51.2 76.8 34.133 91.733 27.733 108.8 32c9.737 2.434 16.697 9.499 24.401 17.318C145.751 62.057 160.275 76.8 192 76.8c34.133 0 55.467-17.067 64-51.2-12.8 17.067-27.733 23.467-44.8 19.2-9.737-2.434-16.697-9.499-24.401-17.318C174.249 14.743 159.725 0 128 0zM64 76.8C29.867 76.8 8.533 93.867 0 128c12.8-17.067 27.733-23.467 44.8-19.2 9.737 2.434 16.697 9.499 24.401 17.318C81.751 138.857 96.275 153.6 128 153.6c34.133 0 55.467-17.067 64-51.2-12.8 17.067-27.733 23.467-44.8 19.2-9.737-2.434-16.697-9.499-24.401-17.318C110.249 91.543 95.725 76.8 64 76.8z" fill="url(#a)"/></svg> </a> </li> <li><a href="https://flowbite.com" target="_blank" class="btn btn-xl mb-2 mr-3 btn-icon-only rounded-circle btn-white" data-toggle="tooltip" title="Based on Flowbite - Tailwind CSS component library"> <svg class="btn-inner-icon" height="32" viewBox="0 0 51 70" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0)"> <path d="M1 53H27.9022C40.6587 53 51 42.7025 51 30H24.0978C11.3412 30 1 40.2975 1 53Z" fill="#76A9FA"/> <path d="M-0.876544 32.1644L-0.876544 66.411C11.9849 66.411 22.4111 55.9847 22.4111 43.1233L22.4111 8.87674C10.1196 8.98051 0.518714 19.5571 -0.876544 32.1644Z" fill="#A4CAFE"/> <path d="M50 5H23.0978C10.3413 5 0 15.2975 0 28H26.9022C39.6588 28 50 17.7025 50 5Z" fill="#1C64F2"/> </g> <defs> <clipPath id="clip0"> <rect width="51" height="70" fill="white"/> </clipPath> </defs> </svg> </a> </li> <li><span class="btn btn-xl mb-2 mr-3 btn-icon-only rounded-circle btn-white" data-toggle="tooltip" title="Webpack module bundler"> <svg class="btn-inner-icon" height="32" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 774 875.7"><title>icon</title><path fill="#FFF" d="M387 0l387 218.9v437.9L387 875.7 0 656.8V218.9z"/><path fill="#8ed6fb" d="M704.9 641.7L399.8 814.3V679.9l190.1-104.6 115 66.4zm20.9-18.9V261.9l-111.6 64.5v232l111.6 64.4zM67.9 641.7L373 814.3V679.9L182.8 575.3 67.9 641.7zM47 622.8V261.9l111.6 64.5v232L47 622.8zm13.1-384.3L373 61.5v129.9L172.5 301.7l-1.6.9-110.8-64.1zm652.6 0l-312.9-177v129.9l200.5 110.2 1.6.9 110.8-64z"/><path fill="#1c78c0" d="M373 649.3L185.4 546.1V341.8L373 450.1v199.2zm26.8 0l187.6-103.1V341.8L399.8 450.1v199.2zm-13.4-207zM198.1 318.2l188.3-103.5 188.3 103.5-188.3 108.7-188.3-108.7z"/></svg> </span> </li> <li><span class="btn btn-xl mb-2 mr-3 btn-icon-only rounded-circle btn-white" data-toggle="tooltip" title="HUGO static site generator"> <svg class="btn-inner-icon" height="32" viewBox="0 0 119 134" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M114.323 85.8421V43.9171C114.323 38.4652 111.436 33.4213 106.735 30.6593C96.6474 24.7324 78.8251 14.2609 67.9102 7.84735C62.1455 4.46191 54.9851 4.53804 49.2958 8.04626C39.6354 14.003 24.5634 23.2965 14.8344 29.2968C8.9668 32.9148 5.39343 39.3139 5.39343 46.2069V89.1326C5.39343 95.97 9.02167 102.293 14.9236 105.743L50.8356 126.735C55.6092 129.526 61.5042 129.587 66.3362 126.896C76.8231 121.054 95.3964 110.711 106.096 104.751C111.171 101.922 114.316 96.5688 114.316 90.7595V85.8418L114.323 85.8421Z" fill="#FF4088"/> <path d="M32.6398 102.322V31.2594H47.5074V57.1441H72.1698V31.2594H87.0806V102.322H72.1698V71.2503H47.5074V102.322H32.6398Z" fill="white"/> </svg </span> </li> </ul> <div class="card bg-soft border-soft p-5 mb-3"> <div class="text-center mb-3 mb-lg-0"> <a href="https://github.com/themesberg/landwind" target="_blank" role="button" class="btn btn-gray animate-up-2 btn-block"> <span class="btn-inner-text"><span class="far fa-books mr-2"></span> Docs v1.0.0</span> </a> </div> </div> <div class="card bg-soft border-soft p-5 mb-5"> <div class="d-block justify-content-between align-items-center mb-0"> <div class="pb-3 mb-3 font-weight-normal"> <div class="d-flex align-items-center justify-content-center"> <i class="fas fa-cloud-download-alt downloads-icon mr-2"></i> <span class="h5 m-0">5645 downloads</span> </div> </div> <div class="pb-3 mb-3 border-bottom" itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <meta itemprop="priceCurrency" content="USD" /> <meta itemprop="availability" content="instock"> <meta itemprop="url" content="https://themesberg.com/product/tailwind-css/landing-page"> <span class="text-gray font-weight-normal"><i class="fad fa-tags mr-2"></i> Price: </span> <span class="font-weight-normal"><span class="currency">$</span><span itemprop="price" class="standard_price">0</span> </div> <div class="pb-3 mb-3 border-bottom"> <span class="text-gray font-weight-normal"><i class="fad fa-bullhorn mr-2"></i> Released: </span> <span class="font-weight-normal">2 years ago</span> </div> <div class="pb-3 mb-3 border-bottom"> <span class="text-gray font-weight-normal"><i class="fad fa-sync-alt mr-2"></i> Updated: </span> <span class="font-weight-normal">2 years ago</span> </div> <div class="pb-3 mb-3 border-bottom"> <span class="text-gray font-weight-normal"><i class="fad fa-code-branch mr-2"></i> Version: </span> <span class="font-weight-normal">1.0.0</span> </div> <div class="pb-3 mb-3 border-bottom"> <span class="text-gray font-weight-normal"><i class="fad fa-list mr-2"></i> Category: </span> <a href="https://themesberg.com/templates/tailwind-css" class="text-gray font-weight-normal">Tailwind CSS</a> </div> <div class="pb-3 mb-3 border-bottom"> <span class="text-gray font-weight-normal"><i class="fad fa-file-contract mr-2"></i> Well Documented </span> </div> <ul class="list-style-none mb-0 mt-5"> <li class="font-small mb-2"><i class="fad fa-check-circle mr-1 text-success"></i> 6 months premium support included</li> <li class="font-small mb-2"><i class="fad fa-check-circle mr-1 text-success"></i> 100% W3C valid HTML5 files</li> <li class="font-small mb-2"><i class="fad fa-check-circle mr-1 text-success"></i> Future updates</li> <li class="font-small mb-2"><i class="fad fa-check-circle mr-1 text-success"></i> Fully responsive pages</li> <li class="font-small mb-2"><i class="fad fa-check-circle mr-1 text-success"></i> 30 day <a href="https://themesberg.com/refund-policy" class="font-weight-light">refund policy</a> </li> <li class="font-small mb-2"><i class="fad fa-check-circle mr-1 text-success"></i> Built by <span itemprop="brand">Themesberg</span></li> </ul> </div> </div> </div> </div> <section class="section-sm mt-5 mt-lg-0 mb-5 mb-lg-0" id="reviews"> <div class="row"> <div class="col-12 col-lg-4 mb-5 mb-lg-0"> <h2 class="mb-2">Customer reviews</h2> <div class="d-flex"> <span class="mb-2 mr-2"> <i class="star fa-star fas text-warning mr-1"> </i> <i class="star fa-star fas text-warning mr-1"> </i> <i class="star fa-star fas text-warning mr-1"> </i> <i class="star fa-star fas text-warning mr-1"> </i> <i class="star fa-star fas text-warning "> </i> </span> <span class="d-block text-center mb-1 font-weight-normal"><span>5.0</span> out of 5</span> </div> <span class="d-block text-sm text-gray-700">1 Reviews for Landwind Tailwind CS</span> </div> <div class="col-12 col-lg-8"> <div> <div itemprop="review" itemscope itemtype="https://schema.org/Review" class="bg-white border shadow-sm p-4 mb-4"> <div class="d-flex justify-content-between mb-4"> <div class="d-flex align-items-center"> <button class="btn btn-xs btn-circle btn-icon-only btn-secondary dropdown-toggle mr-2" aria-haspopup="true" aria-expanded="false"> <span class="fa fa-user"></span> </button> <span itemprop="author" itemscope itemtype="https://schema.org/Person"> <span class="font-weight-normal font-small text-gray-800" itemprop="name">Mark</span> </span> <meta itemprop="datePublished" content="2024-04-15 20:16:48"> <span class="ml-2 text-sm d-none d-md-inline">7 months ago</span> </div> <div class="d-flex justify-content-end align-items-center"> <span class="d-flex justify-content-center"> <i class="star fa-star fas text-warning mr-2"></i> <i class="star fa-star fas text-warning mr-2"></i> <i class="star fa-star fas text-warning mr-2"></i> <i class="star fa-star fas text-warning mr-2"></i> <i class="star fa-star fas text-warning "></i> <span itemprop="reviewRating" itemscope itemtype="https://schema.org/Rating" class="d-none"> <span itemprop="ratingValue">5</span> </span> </span> </div> </div> <p class="m-0 text-md" itemprop="reviewBody">Very useful and awesome design. Clean code. Recommended :)</p> </div> <a href="https://themesberg.com/login" rel="nofollow" data-toggle="tooltip" title="Please sign in or download the item to write a review" class="btn btn-primary"><i class="fad fa-comment-alt-edit mr-2"></i> Write a review</a> </div> </div> </div> </section> <hr class="bg-soft my-0"> <section class="section-sm mt-5 mt-lg-0 mb-5 mb-lg-0" id="changelog"> <h2 class="mb-3">Changelog</h2> <p>We believe that providing meaningful updates to our templates are important to keep up with the evolution of the dependencies, libraries, and the new design requirements that the modern day web industry requires.</p> <p>Below you can see the timeline of changes for Landwind Tailwind CS since its initial launch 2 years ago.</p> <div class="row mt-5 justify-content-between"> <div class="col-12 col-lg-8"> <h3 class="h4 mb-4">Releases</h3> <div class="mb-4"> <a href="#" class="h5 changelog-toggle" data-target="#changelog_0" data-toggle="collapse"> <span class="mr-2 fad fa-tags"></span> v1.0.0 <span class="mx-2">-</span> <span class="changelog-date">July 5th, 2022</span> <span class="ml-3 badge badge-success">Latest release</span> </a> <div class="collapse" id="changelog_0"> <ul class="changelog-list text-monospace"> <li>Initial release</li> </ul> </div> </div> </div> </div> </section> <hr class="bg-soft my-0"> <hr class="bg-soft my-0"> <aside class="section section-sm"> <h3 class="font-weight-medium mb-2">Related themes</h3> <p>Other users were also interested in the following premium templates:</p> <div class="row mt-5"> <div class="col-12 col-md-6 col-lg-4 mb-5"> <div class="product-card show-info card shadow-sm border-soft" data-product-color="#803C68"> <div class="card border-0 bg-transparent"> <figure class="m-0"> <a href="https://themesberg.com/product/ui-kit/pixel-pro-premium-bootstrap-5-ui-kit"> <img data-src="https://themesberg.s3.us-east-2.amazonaws.com/public/products/pixel-pro/pixel-pro-thumb.jpg" class="lazy" alt="Pixel Pro - Premium Bootstrap 5 UI KIT Preview"> </a> <figcaption class="show-on-hover"> <a href="https://themesberg.com/product/ui-kit/pixel-pro-premium-bootstrap-5-ui-kit" class="btn btn-icon-only rounded-circle btn-product-action mr-3" data-toggle="tooltip" data-placement="bottom" title="Theme details"> <span class="btn-inner-icon"><i class="fad fa-list"></i></span> </a> <a href="https://demo.themesberg.com/pixel-pro/v5/" target="_blank" class="btn btn-icon-only rounded-circle btn-product-action" data-toggle="tooltip" data-placement="bottom" title="Live preview"> <span class="btn-inner-icon"><i class="fad fa-laptop"></i></span> </a> </figcaption> </figure> <div class="card-body p-3"> <div class="post-meta pt-2 d-flex align-items-center justify-content-between"> <div> <a href="https://themesberg.com/product/ui-kit/pixel-pro-premium-bootstrap-5-ui-kit" class="mb-2 d-block mt-0 h5 text-dark">Pixel Pro UI Kit</a> <p class="font-weight-light text-gray small m-0">Premium Bootstrap 5 UI Kit with user dashboard</p> </div> </div> <hr class="bg-soft"> <div class="d-flex align-items-center justify-content-between"> <div> <a href="https://themesberg.com/product/ui-kit/pixel-pro-premium-bootstrap-5-ui-kit" class="product-price text-dark">$89</a> </div> <div class="product-counters d-flex"> <a href="https://themesberg.com/product/ui-kit/pixel-pro-premium-bootstrap-5-ui-kit" class="product-card-downloads font-small text-gray-700"> <i class="fad fa-cart-arrow-down mr-1"></i> 417 </a> <a href="https://themesberg.com/product/ui-kit/pixel-pro-premium-bootstrap-5-ui-kit#reviews" class="product-card-downloads font-small text-gray-700 ml-3"> <i class="far fa-star mr-1"></i> 5.0/5 </a> </div> </div> </div> </div> </div> </div> <div class="col-12 col-md-6 col-lg-4 mb-5"> <div class="product-card show-info card shadow-sm border-soft" data-product-color="#ffa031"> <div class="card border-0 bg-transparent"> <figure class="m-0"> <a href="https://themesberg.com/product/admin-dashboard/volt-premium-bootstrap-5-dashboard"> <img data-src="https://themesberg.s3.us-east-2.amazonaws.com/public/products/volt-pro-bootstrap-5-dashboard/volt-pro-preview.jpg" class="lazy" alt="Volt Pro - Premium Bootstrap 5 Dashboard Preview"> </a> <figcaption class="show-on-hover"> <a href="https://themesberg.com/product/admin-dashboard/volt-premium-bootstrap-5-dashboard" class="btn btn-icon-only rounded-circle btn-product-action mr-3" data-toggle="tooltip" data-placement="bottom" title="Theme details"> <span class="btn-inner-icon"><i class="fad fa-list"></i></span> </a> <a href="https://demo.themesberg.com/volt-pro/" target="_blank" class="btn btn-icon-only rounded-circle btn-product-action" data-toggle="tooltip" data-placement="bottom" title="Live preview"> <span class="btn-inner-icon"><i class="fad fa-laptop"></i></span> </a> </figcaption> </figure> <div class="card-body p-3"> <div class="post-meta pt-2 d-flex align-items-center justify-content-between"> <div> <a href="https://themesberg.com/product/admin-dashboard/volt-premium-bootstrap-5-dashboard" class="mb-2 d-block mt-0 h5 text-dark">Volt Pro Bootstrap 5 Dashboard</a> <p class="font-weight-light text-gray small m-0">Premium Bootstrap 5 Admin Template</p> </div> </div> <hr class="bg-soft"> <div class="d-flex align-items-center justify-content-between"> <div> <a href="https://themesberg.com/product/admin-dashboard/volt-premium-bootstrap-5-dashboard" class="product-price text-dark">$69</a> </div> <div class="product-counters d-flex"> <a href="https://themesberg.com/product/admin-dashboard/volt-premium-bootstrap-5-dashboard" class="product-card-downloads font-small text-gray-700"> <i class="fad fa-cart-arrow-down mr-1"></i> 305 </a> <a href="https://themesberg.com/product/admin-dashboard/volt-premium-bootstrap-5-dashboard#reviews" class="product-card-downloads font-small text-gray-700 ml-3"> <i class="far fa-star mr-1"></i> 4.5/5 </a> </div> </div> </div> </div> </div> </div> <div class="col-12 col-md-6 col-lg-4 mb-5"> <div class="product-card show-info card shadow-sm border-soft" data-product-color="#2D4DC8"> <div class="card border-0 bg-transparent"> <figure class="m-0"> <a href="https://themesberg.com/product/ui-kit/neumorphism-ui-kit-bootstrap-pro"> <img data-src="https://themesberg.s3.us-east-2.amazonaws.com/public/products/neumorphism-ui-pro/neumorphism-ui-pro-thumb.jpg" class="lazy" alt="Neumorphism UI PRO Bootstrap Preview"> </a> <figcaption class="show-on-hover"> <a href="https://themesberg.com/product/ui-kit/neumorphism-ui-kit-bootstrap-pro" class="btn btn-icon-only rounded-circle btn-product-action mr-3" data-toggle="tooltip" data-placement="bottom" title="Theme details"> <span class="btn-inner-icon"><i class="fad fa-list"></i></span> </a> <a href="https://demo.themesberg.com/neumorphism-ui-pro/" target="_blank" class="btn btn-icon-only rounded-circle btn-product-action" data-toggle="tooltip" data-placement="bottom" title="Live preview"> <span class="btn-inner-icon"><i class="fad fa-laptop"></i></span> </a> </figcaption> </figure> <div class="card-body p-3"> <div class="post-meta pt-2 d-flex align-items-center justify-content-between"> <div> <a href="https://themesberg.com/product/ui-kit/neumorphism-ui-kit-bootstrap-pro" class="mb-2 d-block mt-0 h5 text-dark">Neumorphism UI PRO</a> <p class="font-weight-light text-gray small m-0">Neumorphism inspired user interface kit</p> </div> </div> <hr class="bg-soft"> <div class="d-flex align-items-center justify-content-between"> <div> <a href="https://themesberg.com/product/ui-kit/neumorphism-ui-kit-bootstrap-pro" class="product-price text-dark">$69</a> </div> <div class="product-counters d-flex"> <a href="https://themesberg.com/product/ui-kit/neumorphism-ui-kit-bootstrap-pro" class="product-card-downloads font-small text-gray-700"> <i class="fad fa-cart-arrow-down mr-1"></i> 203 </a> <a href="https://themesberg.com/product/ui-kit/neumorphism-ui-kit-bootstrap-pro#reviews" class="product-card-downloads font-small text-gray-700 ml-3"> <i class="far fa-star mr-1"></i> 5.0/5 </a> </div> </div> </div> </div> </div> </div> </div> <div class="text-center"> <a href="https://themesberg.com/themes" class="btn btn-primary"><i class="fad fa-th-list mr-2"></i> View all Themes</a> </div> </aside> </div> </div> </div> </main> <section class="footer section section-md mb-5 pt-0 pb-0"> <div class="container"> <div class="row position-relative no-gutters z-2 shadow-sm rounded bg-white"> <div class="col-12 col-lg-6 bg-white rounded"> <div class="border-left-md border-soft py-4 px-3 px-lg-5 m-0 bg-white rounded"> <p class="mb-2 h4">Join our community</p> <p class="font-medium mb-3">Get access to free templates and themes used by over 89371 web developers.</p> <a class="btn btn-sm btn-outline-primary d-none d-sm-inline-block mb-4" href="https://themesberg.com/register"> Create an account for free <span class="fas fa-long-arrow-alt-right ml-2"></span> </a> <p class="text-md">Follow us on social media:</p> <ul class="d-flex flew-row list-style-none"> <li class="mr-3"> <a href="https://twitter.com/themesberg" rel="nofollow noopener" target="_blank" class="btn-sm btn-icon-only rounded-circle btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow @themesberg"> <span class="btn-inner-icon"><i class="fab fa-twitter"></i></span> </a> </li> <li class="mr-3"> <a href="https://www.facebook.com/themesberg/" rel="nofollow noopener" target="_blank" class="btn-sm btn-icon-only rounded-circle btn-facebook" data-toggle="tooltip" data-placement="bottom" title="Like Themesberg"> <span class="btn-inner-icon"><i class="fab fa-facebook"></i></span> </a> </li> <li class="mr-3"> <a href="https://github.com/themesberg" rel="nofollow noopener" target="_blank" class="btn-sm btn-icon-only rounded-circle btn-github" data-toggle="tooltip" data-placement="bottom" title="Open source projects"> <span class="btn-inner-icon"><i class="fab fa-github"></i></span> </a> </li> <li class="mr-3"> <a href="https://www.instagram.com/themesberg/" rel="nofollow noopener" target="_blank" class="btn-sm btn-icon-only rounded-circle btn-instagram" data-toggle="tooltip" data-placement="bottom" title="Follow us on Instagram"> <span class="btn-inner-icon"><i class="fab fa-instagram"></i></span> </a> </li> <li class="mr-3"> <a href="https://dribbble.com/themesberg" rel="nofollow noopener" target="_blank" class="btn-sm btn-icon-only rounded-circle btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow us on Dribbble"> <span class="btn-inner-icon"><i class="fab fa-dribbble"></i></span> </a> </li> <li class="mr-3"> <a href="https://www.linkedin.com/company/themesberg/" rel="nofollow noopener" target="_blank" class="btn-sm btn-icon-only rounded-circle btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow us on LinkedIn"> <span class="btn-inner-icon"><i class="fab fa-linkedin"></i></span> </a> </li> </ul> </div> </div> <div class="col-12 col-lg-6 bg-white rounded"> <div class="border-left-md border-soft py-4 px-3 px-lg-5 m-0 bg-white rounded"> <p class="mb-2 h4">Subscribe to our newsletter</p> <p class="mb-4 text-md">New themes, blog posts, marketplace journey. No spam.</p> <script async data-uid="4e9649fabb" src="https://fabulous-artisan-1281.ck.page/4e9649fabb/index.js"></script> </div> </div> </div> </div> </section> <footer class="pb-6 pt-9 bg-soft mt-n8"> <div class="container"> <div class="row mb-5 justify-content-center"> <div class="col-auto"> <a class="footer-brand" href="https://themesberg.com"> <img class="navbar-brand-light" height="35" src="https://themesberg.com/img/brand/themesberg-footer.svg" alt="Logo Themesberg"> </a> </div> </div> <ul class="text-md-center mb-4 text-center footer-links pl-0"> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://flowbite.com/" target="_blank">Flowbite - Tailwind Components</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/terms-and-conditions">Terms and Conditions</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/privacy-policy">Privacy Policy</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/cookie-policy">Cookie Policy</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/licensing">Licensing</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/knowledge-center">Knowledge Center</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/custom-development">Custom Development</a></li> <li class="list-inline-item text-md px-0 px-sm-2 mb-2"><a href="https://themesberg.com/contact">Contact</a></li> </ul> <div class="row justify-content-center text-center"> <div class="col-12"> <small class="text-gray-700">© 2019-2024 All Rights Reserved. Themesberg™ is a registered trademark of Crafty Dwarf LLC.</small> </div> </div> </div> </footer> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.0/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@15.1.1/dist/lazyload.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/smooth-scroll/16.1.0/smooth-scroll.min.js"></script> <script src="https://themesberg.com/js/themesberg.js"></script> <script src="https://cdn.paddle.com/paddle/paddle.js"></script> <script src="https://themesberg.com/js/checkout.js"></script> </body> </html>