INITIAL COMMIT

This commit is contained in:
2025-04-15 14:55:06 -08:00
commit 47f065dfab
1394 changed files with 183371 additions and 0 deletions

View File

@@ -0,0 +1,826 @@
---
title: Tailwind CSS Services Page with icon features - Flowbite
description: Get started with a collection of over 53 page templates based on Tailwind CSS for Marketing UI purposes including landing pages, contact pages, about pages, and more
layout: main
navbar: default
---
<section class="bg-white dark:bg-gray-900">
<div class="max-w-screen-xl px-4 mx-auto lg:pt-24 pt-20 sm:pt-24 lg:pt-32">
<div class="items-center gap-16 lg:grid lg:grid-cols-2">
<div class="text-gray-500 sm:text-lg dark:text-gray-400">
<h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 sm:text-4xl dark:text-white">Powering
innovation at
200,000+ companies worldwide</h2>
<p class="mb-4">Empower Developers, IT Ops, and business teams to collaborate at high velocity. Respond to
changes
and deliver great customer and employee service experiences fast.</p>
</div>
<div class="mt-4 text-gray-500 sm:text-lg lg:mt-0 dark:text-gray-400">
<p class="mb-4">Track work across the enterprise through an open, collaborative platform. Link issues across
Jira
and ingest data from other software development tools, so your IT support and operations teams have richer
contextual information to rapidly respond to requests, incidents, and changes.</p>
<p>Deliver great service experiences fast - without the complexity of traditional ITSM solutions.Accelerate
critical development work, eliminate toil, and deploy changes with ease, with a complete audit trail for every
change.</p>
</div>
</div>
</div>
</section>
<section class="bg-white dark:bg-gray-900">
<div class="max-w-screen-xl px-4 py-8 mx-auto sm:py-16 lg:py-24">
<div class="text-center md:grid md:grid-cols-2">
<div class="md:pr-8">
<div
class="inline-flex items-center justify-center w-24 h-24 mb-6 rounded-lg bg-primary-100 dark:bg-primary-900">
<svg class="w-16 h-16 mx-auto text-primary-700 dark:text-primary-400" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path d="M2 10a8 8 0 018-8v8h8a8 8 0 11-16 0z"></path>
<path d="M12 2.252A8.014 8.014 0 0117.748 8H12V2.252z"></path>
</svg>
</div>
<h3 class="mb-4 text-2xl font-bold dark:text-white">Just the right balance for growth</h3>
<p class="mb-4 text-gray-500 dark:text-gray-400">Enterprise tools cost more, are difficult to use, and take
longer to implement. According to G2, Flowbite is the easiest-to-use tool, with the fastest time to ROI.</p>
</div>
<div class="mt-8 md:border-gray-100 md:mt-0 md:pl-8 md:border-l dark:border-gray-800">
<div class="inline-flex items-center justify-center w-24 h-24 mb-6 bg-purple-100 rounded-lg dark:bg-purple-900">
<svg class="w-16 h-16 mx-auto text-purple-600 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M9.504 1.132a1 1 0 01.992 0l1.75 1a1 1 0 11-.992 1.736L10 3.152l-1.254.716a1 1 0 11-.992-1.736l1.75-1zM5.618 4.504a1 1 0 01-.372 1.364L5.016 6l.23.132a1 1 0 11-.992 1.736L4 7.723V8a1 1 0 01-2 0V6a.996.996 0 01.52-.878l1.734-.99a1 1 0 011.364.372zm8.764 0a1 1 0 011.364-.372l1.733.99A1.002 1.002 0 0118 6v2a1 1 0 11-2 0v-.277l-.254.145a1 1 0 11-.992-1.736l.23-.132-.23-.132a1 1 0 01-.372-1.364zm-7 4a1 1 0 011.364-.372L10 8.848l1.254-.716a1 1 0 11.992 1.736L11 10.58V12a1 1 0 11-2 0v-1.42l-1.246-.712a1 1 0 01-.372-1.364zM3 11a1 1 0 011 1v1.42l1.246.712a1 1 0 11-.992 1.736l-1.75-1A1 1 0 012 14v-2a1 1 0 011-1zm14 0a1 1 0 011 1v2a1 1 0 01-.504.868l-1.75 1a1 1 0 11-.992-1.736L16 13.42V12a1 1 0 011-1zm-9.618 5.504a1 1 0 011.364-.372l.254.145V16a1 1 0 112 0v.277l.254-.145a1 1 0 11.992 1.736l-1.735.992a.995.995 0 01-1.022 0l-1.735-.992a1 1 0 01-.372-1.364z"
clip-rule="evenodd"></path>
</svg>
</div>
<h3 class="mb-4 text-2xl font-bold dark:text-white">A better platform and partner</h3>
<p class="mb-4 text-gray-500 dark:text-gray-400">Third party research shows Flowbite has a net promoter score of
31, while our competitors score is 2. The market has
spoken—more customers are satisfied with our platform and service.</p>
</div>
</div>
<p class="mt-8 text-center sm:mt-12 lg:mt-16">
<a href="#"
class="inline-flex items-center font-medium text-primary-700 hover:underline dark:text-primary-500">
Learn what makes Flowbite different <svg class="w-5 h-5 ml-1" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
clip-rule="evenodd"></path>
</svg>
</a>
</p>
</div>
</section>
<section class="border-t border-b border-gray-100 bg-gray-50 dark:bg-gray-800 dark:border-gray-700">
<div class="max-w-screen-xl px-4 py-8 mx-auto sm:py-16 lg:py-24">
<div class="max-w-3xl mx-auto text-center">
<h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 sm:text-4xl dark:text-white">Secure platform,
secure data
</h2>
<p class="text-gray-500 dark:text-gray-400 sm:text-xl">Here at Flowbite we focus on markets where
technology, innovation, and capital can unlock long-term value and drive economic growth.</p>
</div>
<div
class="mt-8 space-y-6 md:grid md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 md:gap-8 xl:gap-8 md:space-y-0 sm:mt-12 lg:mt-16">
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M6.672 1.911a1 1 0 10-1.932.518l.259.966a1 1 0 001.932-.518l-.26-.966zM2.429 4.74a1 1 0 10-.517 1.932l.966.259a1 1 0 00.517-1.932l-.966-.26zm8.814-.569a1 1 0 00-1.415-1.414l-.707.707a1 1 0 101.415 1.415l.707-.708zm-7.071 7.072l.707-.707A1 1 0 003.465 9.12l-.708.707a1 1 0 001.415 1.415zm3.2-5.171a1 1 0 00-1.3 1.3l4 10a1 1 0 001.823.075l1.38-2.759 3.018 3.02a1 1 0 001.414-1.415l-3.019-3.02 2.76-1.379a1 1 0 00-.076-1.822l-10-4z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Platform
</h3>
<p class="text-gray-500 dark:text-gray-400">
We keep Flowbite, secure, and free of spam and abuse so that this can be the platform where developers come
together to
create.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M12.316 3.051a1 1 0 01.633 1.265l-4 12a1 1 0 11-1.898-.632l4-12a1 1 0 011.265-.633zM5.707 6.293a1 1 0 010 1.414L3.414 10l2.293 2.293a1 1 0 11-1.414 1.414l-3-3a1 1 0 010-1.414l3-3a1 1 0 011.414 0zm8.586 0a1 1 0 011.414 0l3 3a1 1 0 010 1.414l-3 3a1 1 0 11-1.414-1.414L16.586 10l-2.293-2.293a1 1 0 010-1.414z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Open source
</h3>
<p class="text-gray-500 dark:text-gray-400">
Our Flowbite Security Lab is a world-class security R&D team. We inspire and enable the community to secure
open source.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path
d="M11 3a1 1 0 10-2 0v1a1 1 0 102 0V3zM15.657 5.757a1 1 0 00-1.414-1.414l-.707.707a1 1 0 001.414 1.414l.707-.707zM18 10a1 1 0 01-1 1h-1a1 1 0 110-2h1a1 1 0 011 1zM5.05 6.464A1 1 0 106.464 5.05l-.707-.707a1 1 0 00-1.414 1.414l.707.707zM5 10a1 1 0 01-1 1H3a1 1 0 110-2h1a1 1 0 011 1zM8 16v-1h4v1a2 2 0 11-4 0zM12 14c.015-.34.208-.646.477-.859a4 4 0 10-4.954 0c.27.213.462.519.476.859h4.002z" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Premium products
</h3>
<p class="text-gray-500 dark:text-gray-400">
We embody the shift toward investments in safe and secure software design practices with our world-class
front-end
products.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M4 2a2 2 0 00-2 2v11a3 3 0 106 0V4a2 2 0 00-2-2H4zm1 14a1 1 0 100-2 1 1 0 000 2zm5-1.757l4.9-4.9a2 2 0 000-2.828L13.485 5.1a2 2 0 00-2.828 0L10 5.757v8.486zM16 18H9.071l6-6H16a2 2 0 012 2v2a2 2 0 01-2 2z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Customization
</h3>
<p class="text-gray-500 dark:text-gray-400">
It's easy to customize and style Flowbite. Tweak the look and feel of your UI with CSS/Less, and add major
features with
HTML.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M12.395 2.553a1 1 0 00-1.45-.385c-.345.23-.614.558-.822.88-.214.33-.403.713-.57 1.116-.334.804-.614 1.768-.84 2.734a31.365 31.365 0 00-.613 3.58 2.64 2.64 0 01-.945-1.067c-.328-.68-.398-1.534-.398-2.654A1 1 0 005.05 6.05 6.981 6.981 0 003 11a7 7 0 1011.95-4.95c-.592-.591-.98-.985-1.348-1.467-.363-.476-.724-1.063-1.207-2.03zM12.12 15.12A3 3 0 017 13s.879.5 2.5.5c0-1 .5-4 1.25-4.5.5 1 .786 1.293 1.371 1.879A2.99 2.99 0 0113 13a2.99 2.99 0 01-.879 2.121z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Features
</h3>
<p class="text-gray-500 dark:text-gray-400">
Start with thousands of actions and applications from our community to help you build, improve, and accelerate
your
automated workflows.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M6.625 2.655A9 9 0 0119 11a1 1 0 11-2 0 7 7 0 00-9.625-6.492 1 1 0 11-.75-1.853zM4.662 4.959A1 1 0 014.75 6.37 6.97 6.97 0 003 11a1 1 0 11-2 0 8.97 8.97 0 012.25-5.953 1 1 0 011.412-.088z"
clip-rule="evenodd" />
<path fill-rule="evenodd"
d="M5 11a5 5 0 1110 0 1 1 0 11-2 0 3 3 0 10-6 0c0 1.677-.345 3.276-.968 4.729a1 1 0 11-1.838-.789A9.964 9.964 0 005 11zm8.921 2.012a1 1 0 01.831 1.145 19.86 19.86 0 01-.545 2.436 1 1 0 11-1.92-.558c.207-.713.371-1.445.49-2.192a1 1 0 011.144-.83z"
clip-rule="evenodd" />
<path fill-rule="evenodd"
d="M10 10a1 1 0 011 1c0 2.236-.46 4.368-1.29 6.304a1 1 0 01-1.838-.789A13.952 13.952 0 009 11a1 1 0 011-1z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Data privacy
</h3>
<p class="text-gray-500 dark:text-gray-400">
Flowbite is committed to developer privacy and provides a high standard of privacy protection to all our
customers and
team.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-2 0c0 .993-.241 1.929-.668 2.754l-1.524-1.525a3.997 3.997 0 00.078-2.183l1.562-1.562C15.802 8.249 16 9.1 16 10zm-5.165 3.913l1.58 1.58A5.98 5.98 0 0110 16a5.976 5.976 0 01-2.516-.552l1.562-1.562a4.006 4.006 0 001.789.027zm-4.677-2.796a4.002 4.002 0 01-.041-2.08l-.08.08-1.53-1.533A5.98 5.98 0 004 10c0 .954.223 1.856.619 2.657l1.54-1.54zm1.088-6.45A5.974 5.974 0 0110 4c.954 0 1.856.223 2.657.619l-1.54 1.54a4.002 4.002 0 00-2.346.033L7.246 4.668zM12 10a2 2 0 11-4 0 2 2 0 014 0z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
Support 24/7
</h3>
<p class="text-gray-500 dark:text-gray-400">
We provide high-quality services all around the world with personal assistance through our 24/7 premium
service.
</p>
</div>
<div class="p-6 bg-white rounded-lg shadow-sm dark:bg-gray-700">
<div
class="flex items-center justify-center w-10 h-10 mb-4 rounded-lg bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900">
<svg class="w-5 h-5 text-primary-700 lg:w-8 lg:h-8 dark:text-primary-400" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M10 18a8 8 0 100-16 8 8 0 000 16zM4.332 8.027a6.012 6.012 0 011.912-2.706C6.512 5.73 6.974 6 7.5 6A1.5 1.5 0 019 7.5V8a2 2 0 004 0 2 2 0 011.523-1.943A5.977 5.977 0 0116 10c0 .34-.028.675-.083 1H15a2 2 0 00-2 2v2.197A5.973 5.973 0 0110 16v-2a2 2 0 00-2-2 2 2 0 01-2-2 2 2 0 00-1.668-1.973z"
clip-rule="evenodd" />
</svg>
</div>
<h3 class="mb-2 text-xl font-bold dark:text-white">
GDPR
</h3>
<p class="text-gray-500 dark:text-gray-400">
Our project is full GDPR compliant. GDPR compliance is shown through our strong and transparent actions, not
through
certifications.
</p>
</div>
</div>
</div>
</section>
<section class="antialiased bg-white dark:bg-gray-900">
<div class="max-w-screen-xl px-4 py-8 mx-auto sm:py-16 lg:py-24">
<div class="max-w-2xl mx-auto text-center">
<h2 class="text-3xl font-extrabold leading-tight tracking-tight text-gray-900 sm:text-4xl dark:text-white">
Our work
</h2>
<p class="mt-4 text-base font-normal text-gray-500 sm:text-xl dark:text-gray-400">
Flowbite helps you connect with friends, family and communities of people who share your interests.
</p>
</div>
<div class="mt-12 space-y-16 sm:mt-16">
<div class="flex flex-col lg:items-center lg:flex-row gap-y-8 sm:gap-y-12 lg:gap-x-16 xl:gap-x-24">
<div>
<img class="object-cover w-full rounded-lg shadow-lg dark:hidden"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/case-study/flowbite-dashboard.jpg" alt="">
<img class="hidden object-cover w-full rounded-lg shadow-lg dark:block"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/case-study/flowbite-dashboard-dark.jpg" alt="">
</div>
<div class="w-full space-y-6 lg:max-w-lg shrink-0 xl:max-w-2xl">
<div class="space-y-3">
<h3 class="text-3xl font-bold leading-tight text-gray-900 sm:text-4xl dark:text-white">
Flowbite's dashboard
</h3>
<a href="https://flowbite.com" title=""
class="inline-flex items-center text-lg font-medium text-primary-700 hover:underline dark:text-primary-500">
https://flowbite.com
<svg aria-hidden="true" class="w-5 h-5 ml-2.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor">
<path
d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z" />
<path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z" />
</svg>
</a>
<p class="text-base font-normal text-gray-500 sm:text-lg dark:text-gray-400">
Flowbite helps you connect with friends, family and communities of people who share your interests.
Connecting with your
friends and family as well as discovering new ones is easy with features like Groups.
</p>
</div>
<div class="flex items-center gap-2.5">
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-html5" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/html5.svg" alt="">
</div>
<div id="tooltip-logo-html5" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
HTML5
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-css3" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/css-3.svg" alt="">
</div>
<div id="tooltip-logo-css3" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
CSS3
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-javascript" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/javascript.svg" alt="">
</div>
<div id="tooltip-logo-javascript" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
JavaScript
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-tailwind-css" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/tailwind-css.svg" alt="">
</div>
<div id="tooltip-logo-tailwind-css" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
Tailwind CSS
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-typescript" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/typescript.svg" alt="">
</div>
<div id="tooltip-logo-typescript" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
TypeScript
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
</div>
<a href="#" title=""
class="text-white bg-primary-700 justify-center hover:bg-primary-800 inline-flex items-center focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"
role="button">
View case study
<svg aria-hidden="true" class="w-5 h-5 ml-2 -mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor">
<path fill-rule="evenodd"
d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z"
clip-rule="evenodd" />
</svg>
</a>
</div>
</div>
<div class="flex flex-col lg:items-center lg:flex-row gap-y-8 sm:gap-y-12 lg:gap-x-16 xl:gap-x-24">
<div class="lg:order-2">
<img class="object-cover w-full rounded-lg shadow-lg dark:hidden"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/case-study/agency-landing-page.jpg" alt="">
<img class="hidden object-cover w-full rounded-lg shadow-lg dark:block"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/case-study/agency-landing-page-dark.jpg" alt="">
</div>
<div class="w-full space-y-6 lg:max-w-lg shrink-0 xl:max-w-2xl lg:order-1">
<div class="space-y-3">
<h3 class="text-3xl font-bold leading-tight text-gray-900 sm:text-4xl dark:text-white">
Agency Landing Page
</h3>
<a href="https://themesberg.com" title=""
class="inline-flex items-center text-lg font-medium text-primary-700 hover:underline dark:text-primary-500">
https://themesberg.com
<svg aria-hidden="true" class="w-5 h-5 ml-2.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor">
<path
d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z" />
<path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z" />
</svg>
</a>
<p class="text-base font-normal text-gray-500 sm:text-lg dark:text-gray-400">
Flowbite helps you connect with friends, family and communities of people who share your interests.
Connecting with your
friends and family as well as discovering new ones is easy with features like Groups.
</p>
</div>
<div class="flex items-center gap-2.5">
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-wordpress" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/wordpress.svg" alt="">
</div>
<div id="tooltip-logo-wordpress" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
WordPress
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-html5" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/html5.svg" alt="">
</div>
<div id="tooltip-logo-html5" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
HTML5
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-css3" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/css-3.svg" alt="">
</div>
<div id="tooltip-logo-css3" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
CSS3
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-woocommerce" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/woocommerce.svg" alt="">
</div>
<div id="tooltip-logo-woocommerce" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
WooCommerce
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
</div>
<a href="#" title=""
class="text-white bg-primary-700 justify-center hover:bg-primary-800 inline-flex items-center focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"
role="button">
View case study
<svg aria-hidden="true" class="w-5 h-5 ml-2 -mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor">
<path fill-rule="evenodd"
d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z"
clip-rule="evenodd" />
</svg>
</a>
</div>
</div>
<div class="flex flex-col lg:items-center lg:flex-row gap-y-8 sm:gap-y-12 lg:gap-x-16 xl:gap-x-24">
<div>
<img class="object-cover w-full rounded-lg shadow-lg dark:hidden"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/case-study/mail-management-system.jpg" alt="">
<img class="hidden object-cover w-full rounded-lg shadow-lg dark:block"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/case-study/mail-management-system-dark.jpg"
alt="">
</div>
<div class="w-full space-y-6 lg:max-w-lg shrink-0 xl:max-w-2xl">
<div class="space-y-3">
<h3 class="text-3xl font-bold leading-tight text-gray-900 sm:text-4xl dark:text-white">
Mail management system
</h3>
<a href="https://ui.glass" title=""
class="inline-flex items-center text-lg font-medium text-primary-700 hover:underline dark:text-primary-500">
https://ui.glass
<svg aria-hidden="true" class="w-5 h-5 ml-2.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor">
<path
d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z" />
<path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z" />
</svg>
</a>
<p class="text-base font-normal text-gray-500 sm:text-lg dark:text-gray-400">
Flowbite helps you connect with friends, family and communities of people who share your interests.
Connecting with your
friends and family as well as discovering new ones is easy with features like Groups.
</p>
</div>
<div class="flex items-center gap-2.5">
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-typescript" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/typescript.svg" alt="">
</div>
<div id="tooltip-logo-typescript" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
TypeScript
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-java" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/java.svg" alt="">
</div>
<div id="tooltip-logo-java" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
Java
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-tailwind-css" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/tailwind-css.svg" alt="">
</div>
<div id="tooltip-logo-tailwind-css" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
Tailwind CSS
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-react" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/react.svg" alt="">
</div>
<div id="tooltip-logo-react" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
React
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-html5" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/html5.svg" alt="">
</div>
<div id="tooltip-logo-html5" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
HTML5
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
<div class="p-1 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800">
<img data-tooltip-target="tooltip-logo-amazon-web-services" class="object-contain w-auto h-8"
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/technologies/amazon-web-services.svg" alt="">
</div>
<div id="tooltip-logo-amazon-web-services" role="tooltip"
class="absolute z-10 invisible inline-block px-3 py-2 text-sm font-medium text-white transition-opacity duration-300 bg-gray-900 rounded-lg shadow-xs opacity-0 tooltip dark:bg-gray-700">
Amazon Web Services
<div class="tooltip-arrow" data-popper-arrow></div>
</div>
</div>
<a href="#" title=""
class="text-white bg-primary-700 justify-center hover:bg-primary-800 inline-flex items-center focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"
role="button">
View case study
<svg aria-hidden="true" class="w-5 h-5 ml-2 -mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor">
<path fill-rule="evenodd"
d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z"
clip-rule="evenodd" />
</svg>
</a>
</div>
</div>
</div>
</div>
</section>
<section class="bg-white dark:bg-gray-900 border-t border-gray-100 dark:border-gray-800">
<div class="max-w-screen-xl px-4 py-8 mx-auto sm:py-16 lg:py-24">
<div
class="items-center justify-between gap-8 p-6 text-gray-900 rounded-lg shadow-lg dark:text-white bg-gray-50 dark:bg-gray-800 lg:flex md:p-12">
<div class="w-full max-w-2xl lg:flex-1">
<h2 class="mb-4 text-3xl font-extrabold tracking-tight sm:text-4xl">Sign up for our newsletter</h2>
<p class="text-gray-500 dark:text-gray-400 sm:text-xl">Stay up to date with the roadmap progress,
announcements and
exclusive discounts feel free to sign up with your email.</p>
</div>
<div class="mt-6 lg:mt-0">
<form action="#">
<div class="items-center mb-3 space-y-4 sm:flex sm:space-y-0">
<div class="relative w-full">
<label for="member_email" class="hidden mb-2 text-sm font-medium text-gray-900 dark:text-gray-300">Email
address</label>
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<svg class="w-5 h-5 text-gray-500 dark:text-gray-400" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path d="M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z"></path>
<path d="M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z"></path>
</svg>
</div>
<input
class="block w-full p-3 pl-10 text-sm text-gray-900 bg-white border border-gray-300 rounded-lg sm:rounded-none sm:rounded-l-lg focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
placeholder="Enter your email" type="email" required="">
</div>
<div>
<button type="submit"
class="w-full px-5 py-3 text-sm font-medium text-center text-white border rounded-lg cursor-pointer bg-primary-700 border-primary-700 hover:border-primary-800 sm:rounded-none sm:rounded-r-lg hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 dark:bg-primary-600 dark:hover:bg-primary-700 dark:border-primary-600 dark:hover:border-primary-700 dark:focus:ring-primary-800">Subscribe</button>
</div>
</div>
<div class="text-sm text-left text-gray-500 dark:text-gray-400">We care about the protection of your data.
Read our <a href="#" class="font-medium text-gray-900 underline dark:text-white">Privacy Policy</a>.</div>
</form>
</div>
</div>
</div>
</section>
<footer class="bg-white dark:bg-gray-900">
<div class="max-w-screen-xl px-4 pb-8 mx-auto sm:pb-16">
<div class="gap-8 space-y-12 sm:grid sm:grid-cols-2 lg:grid-cols-3 sm:space-y-0">
<address class="not-italic">
<p class="mb-6 text-sm font-semibold text-gray-900 uppercase dark:text-white">New York</p>
<p class="mb-3 text-gray-500 dark:text-gray-400">Huntersville,<br> 957 Hill Hills Suite 491, United States
</p>
<ul class="space-y-3 text-gray-500 dark:text-gray-400">
<li class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M7 2a2 2 0 00-2 2v12a2 2 0 002 2h6a2 2 0 002-2V4a2 2 0 00-2-2H7zm3 14a1 1 0 100-2 1 1 0 000 2z"
clip-rule="evenodd"></path>
</svg>
Office: +12(3) 456 7890 1234
</li>
<li class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path d="M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z"></path>
<path d="M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z"></path>
</svg>
Support: <a href="mailto:company@name.com" class="ml-2 hover:underline">company@name.com</a>
</li>
</ul>
</address>
<address class="not-italic">
<p class="mb-6 text-sm font-semibold text-gray-900 uppercase dark:text-white">Rome</p>
<p class="mb-3 text-gray-500 dark:text-gray-400">Piazza di Spagna,<br> 00187 Roma RM, Italy
</p>
<ul class="space-y-3 text-gray-500 dark:text-gray-400">
<li class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M7 2a2 2 0 00-2 2v12a2 2 0 002 2h6a2 2 0 002-2V4a2 2 0 00-2-2H7zm3 14a1 1 0 100-2 1 1 0 000 2z"
clip-rule="evenodd"></path>
</svg>
Office: +12(3) 456 7890 1234
</li>
<li class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path d="M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z"></path>
<path d="M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z"></path>
</svg>
Support: <a href="mailto:company@name.com" class="ml-2 hover:underline">company@name.it</a>
</li>
</ul>
</address>
<address class="not-italic">
<p class="mb-6 text-sm font-semibold text-gray-900 uppercase dark:text-white">London</p>
<p class="mb-3 text-gray-500 dark:text-gray-400">Fulham Rd,<br>London SW6 1HS, United Kingdom
</p>
<ul class="space-y-3 text-gray-500 dark:text-gray-400">
<li class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M7 2a2 2 0 00-2 2v12a2 2 0 002 2h6a2 2 0 002-2V4a2 2 0 00-2-2H7zm3 14a1 1 0 100-2 1 1 0 000 2z"
clip-rule="evenodd"></path>
</svg>
Office: +12(3) 456 7890 1234
</li>
<li class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path d="M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z"></path>
<path d="M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z"></path>
</svg>
Support: <a href="mailto:company@name.com" class="ml-2 hover:underline">company@name.co.uk</a>
</li>
</ul>
</address>
</div>
<div class="flex flex-col items-center justify-between mt-8 lg:flex-row sm:mt-12 lg:mt-16">
<a href="#" class="flex items-center mb-6 text-2xl font-semibold text-gray-900 lg:mb-0 dark:text-white">
<svg class="h-8 mr-2" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M25.2696 13.126C25.1955 13.6364 24.8589 14.3299 24.4728 14.9328C23.9856 15.6936 23.2125 16.2264 22.3276 16.4114L18.43 17.2265C17.8035 17.3575 17.2355 17.6853 16.8089 18.1621L14.2533 21.0188C13.773 21.5556 13.4373 21.4276 13.4373 20.7075C13.4315 20.7342 12.1689 23.9903 15.5149 25.9202C16.8005 26.6618 18.6511 26.3953 19.9367 25.6538L26.7486 21.7247C29.2961 20.2553 31.0948 17.7695 31.6926 14.892C31.7163 14.7781 31.7345 14.6639 31.7542 14.5498L25.2696 13.126Z"
fill="url(#paint0_linear_11430_22515)" />
<path
d="M23.5028 9.20133C24.7884 9.94288 25.3137 11.0469 25.3137 12.53C25.3137 12.7313 25.2979 12.9302 25.2694 13.1261L28.0141 14.3051L31.754 14.5499C32.2329 11.7784 31.2944 8.92561 29.612 6.65804C28.3459 4.9516 26.7167 3.47073 24.7581 2.34097C23.167 1.42325 21.5136 0.818599 19.8525 0.486816L17.9861 2.90382L17.3965 5.67918L23.5028 9.20133Z"
fill="url(#paint1_linear_11430_22515)" />
<path
d="M1.5336 11.2352C1.5329 11.2373 1.53483 11.238 1.53556 11.2358C1.67958 10.8038 1.86018 10.3219 2.08564 9.80704C3.26334 7.11765 5.53286 5.32397 8.32492 4.40943C11.117 3.49491 14.1655 3.81547 16.7101 5.28323L17.3965 5.67913L19.8525 0.486761C12.041 -1.07341 4.05728 3.51588 1.54353 11.2051C1.54233 11.2087 1.53796 11.2216 1.5336 11.2352Z"
fill="url(#paint2_linear_11430_22515)" />
<path
d="M19.6699 25.6538C18.3843 26.3953 16.8003 26.3953 15.5147 25.6538C15.3402 25.5531 15.1757 25.4399 15.0201 25.3174L12.7591 26.8719L10.8103 30.0209C12.9733 31.821 15.7821 32.3997 18.589 32.0779C20.7013 31.8357 22.7995 31.1665 24.7582 30.0368C26.3492 29.1191 27.7 27.9909 28.8182 26.7195L27.6563 23.8962L25.7762 22.1316L19.6699 25.6538Z"
fill="url(#paint3_linear_11430_22515)" />
<path
d="M15.0201 25.3175C14.0296 24.5373 13.4371 23.3406 13.4371 22.0588V21.931V11.2558C13.4371 10.6521 13.615 10.5494 14.1384 10.8513C13.3323 10.3864 11.4703 8.79036 9.17118 10.1165C7.88557 10.858 6.8269 12.4949 6.8269 13.978V21.8362C6.8269 24.775 8.34906 27.8406 10.5445 29.7966C10.6313 29.874 10.7212 29.9469 10.8103 30.0211L15.0201 25.3175Z"
fill="url(#paint4_linear_11430_22515)" />
<path
d="M28.6604 5.49565C28.6589 5.49395 28.6573 5.49532 28.6589 5.49703C28.9613 5.83763 29.2888 6.23485 29.6223 6.68734C31.3648 9.05099 32.0158 12.0447 31.4126 14.9176C30.8093 17.7906 29.0071 20.2679 26.4625 21.7357L25.7761 22.1316L28.8181 26.7195C34.0764 20.741 34.09 11.5388 28.6815 5.51929C28.6789 5.51641 28.67 5.50622 28.6604 5.49565Z"
fill="url(#paint5_linear_11430_22515)" />
<path
d="M7.09355 13.978C7.09354 12.4949 7.88551 11.1244 9.17113 10.3829C9.34564 10.2822 9.52601 10.1965 9.71002 10.1231L9.49304 7.38962L7.96861 4.26221C5.32671 5.23364 3.1897 7.24125 2.06528 9.83067C1.2191 11.7793 0.75001 13.9294 0.75 16.1888C0.75 18.0243 1.05255 19.7571 1.59553 21.3603L4.62391 21.7666L7.09355 21.0223V13.978Z"
fill="url(#paint6_linear_11430_22515)" />
<path
d="M9.71016 10.1231C10.8817 9.65623 12.2153 9.74199 13.3264 10.3829L13.4372 10.4468L22.3326 15.5777C22.9566 15.9376 22.8999 16.2918 22.1946 16.4392L22.7078 16.332C23.383 16.1908 23.9999 15.8457 24.4717 15.3428C25.2828 14.4782 25.5806 13.4351 25.5806 12.5299C25.5806 11.0468 24.7886 9.67634 23.503 8.93479L16.6911 5.00568C14.1436 3.53627 11.0895 3.22294 8.29622 4.14442C8.18572 4.18087 8.07756 4.2222 7.96875 4.26221L9.71016 10.1231Z"
fill="url(#paint7_linear_11430_22515)" />
<path
d="M20.0721 31.8357C20.0744 31.8352 20.0739 31.8332 20.0717 31.8337C19.6252 31.925 19.1172 32.0097 18.5581 32.0721C15.638 32.3978 12.7174 31.4643 10.5286 29.5059C8.33986 27.5474 7.09347 24.7495 7.09348 21.814L7.09347 21.0222L1.59546 21.3602C4.1488 28.8989 12.1189 33.5118 20.0411 31.8421C20.0449 31.8413 20.0582 31.8387 20.0721 31.8357Z"
fill="url(#paint8_linear_11430_22515)" />
<defs>
<linearGradient id="paint0_linear_11430_22515" x1="20.8102" y1="23.9532" x2="23.9577" y2="12.9901"
gradientUnits="userSpaceOnUse">
<stop stop-color="#1724C9" />
<stop offset="1" stop-color="#1C64F2" />
</linearGradient>
<linearGradient id="paint1_linear_11430_22515" x1="28.0593" y1="10.5837" x2="19.7797" y2="2.33321"
gradientUnits="userSpaceOnUse">
<stop stop-color="#1C64F2" />
<stop offset="1" stop-color="#0092FF" />
</linearGradient>
<linearGradient id="paint2_linear_11430_22515" x1="16.9145" y1="5.2045" x2="4.42432" y2="5.99375"
gradientUnits="userSpaceOnUse">
<stop stop-color="#0092FF" />
<stop offset="1" stop-color="#45B2FF" />
</linearGradient>
<linearGradient id="paint3_linear_11430_22515" x1="16.0698" y1="28.846" x2="27.2866" y2="25.8192"
gradientUnits="userSpaceOnUse">
<stop stop-color="#1C64F2" />
<stop offset="1" stop-color="#0092FF" />
</linearGradient>
<linearGradient id="paint4_linear_11430_22515" x1="8.01881" y1="15.8661" x2="15.9825" y2="24.1181"
gradientUnits="userSpaceOnUse">
<stop stop-color="#1724C9" />
<stop offset="1" stop-color="#1C64F2" />
</linearGradient>
<linearGradient id="paint5_linear_11430_22515" x1="26.2004" y1="21.8189" x2="31.7569" y2="10.6178"
gradientUnits="userSpaceOnUse">
<stop stop-color="#0092FF" />
<stop offset="1" stop-color="#45B2FF" />
</linearGradient>
<linearGradient id="paint6_linear_11430_22515" x1="6.11387" y1="9.31427" x2="3.14054" y2="20.4898"
gradientUnits="userSpaceOnUse">
<stop stop-color="#1C64F2" />
<stop offset="1" stop-color="#0092FF" />
</linearGradient>
<linearGradient id="paint7_linear_11430_22515" x1="21.2932" y1="8.78271" x2="10.4278" y2="11.488"
gradientUnits="userSpaceOnUse">
<stop stop-color="#1724C9" />
<stop offset="1" stop-color="#1C64F2" />
</linearGradient>
<linearGradient id="paint8_linear_11430_22515" x1="7.15667" y1="21.5399" x2="14.0824" y2="31.9579"
gradientUnits="userSpaceOnUse">
<stop stop-color="#0092FF" />
<stop offset="1" stop-color="#45B2FF" />
</linearGradient>
</defs>
</svg>
Flowbite
</a>
<span class="block mb-4 text-sm text-gray-500 dark:text-gray-400 lg:mb-0">© 2021-<span id="currentYear">2023</span> <a href="#"
class="hover:underline">Flowbite™</a>. All Rights Reserved.
</span>
<button id="dropdownDefault" data-dropdown-toggle="dropdown"
class="inline-flex items-center mt-3 text-sm font-medium text-center text-gray-500 sm:mt-0 hover:text-gray-900 dark:hover:text-white dark:text-gray-400"
type="button">
<svg class="w-4 h-4 mr-1" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.75" y="0.466187" width="20" height="13.3137" rx="2" fill="white" />
<mask id="mask0_3422_20233" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="21"
height="14">
<rect x="0.75" y="0.466187" width="20" height="13.3137" rx="2" fill="white" />
</mask>
<g mask="url(#mask0_3422_20233)">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M20.75 0.466187H0.75V1.35377H20.75V0.466187ZM20.75 2.24134H0.75V3.12892H20.75V2.24134ZM0.75 4.0165H20.75V4.90408H0.75V4.0165ZM20.75 5.79166H0.75V6.67924H20.75V5.79166ZM0.75 7.56682H20.75V8.4544H0.75V7.56682ZM20.75 9.34198H0.75V10.2296H20.75V9.34198ZM0.75 11.1171H20.75V12.0047H0.75V11.1171ZM20.75 12.8923H0.75V13.7799H20.75V12.8923Z"
fill="#D02F44" />
<rect x="0.75" y="0.466187" width="8.57143" height="6.21305" fill="#46467F" />
<g filter="url(#filter0_d_3422_20233)">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M2.65477 1.79755C2.65477 2.04265 2.44158 2.24134 2.17858 2.24134C1.91559 2.24134 1.70239 2.04265 1.70239 1.79755C1.70239 1.55245 1.91559 1.35376 2.17858 1.35376C2.44158 1.35376 2.65477 1.55245 2.65477 1.79755ZM4.55954 1.79755C4.55954 2.04265 4.34634 2.24134 4.08334 2.24134C3.82035 2.24134 3.60715 2.04265 3.60715 1.79755C3.60715 1.55245 3.82035 1.35376 4.08334 1.35376C4.34634 1.35376 4.55954 1.55245 4.55954 1.79755ZM5.98811 2.24134C6.2511 2.24134 6.4643 2.04265 6.4643 1.79755C6.4643 1.55245 6.2511 1.35376 5.98811 1.35376C5.72511 1.35376 5.51192 1.55245 5.51192 1.79755C5.51192 2.04265 5.72511 2.24134 5.98811 2.24134ZM8.36906 1.79755C8.36906 2.04265 8.15586 2.24134 7.89287 2.24134C7.62988 2.24134 7.41668 2.04265 7.41668 1.79755C7.41668 1.55245 7.62988 1.35376 7.89287 1.35376C8.15586 1.35376 8.36906 1.55245 8.36906 1.79755ZM3.13096 3.12892C3.39396 3.12892 3.60715 2.93023 3.60715 2.68513C3.60715 2.44003 3.39396 2.24134 3.13096 2.24134C2.86797 2.24134 2.65477 2.44003 2.65477 2.68513C2.65477 2.93023 2.86797 3.12892 3.13096 3.12892ZM5.51192 2.68513C5.51192 2.93023 5.29872 3.12892 5.03573 3.12892C4.77273 3.12892 4.55954 2.93023 4.55954 2.68513C4.55954 2.44003 4.77273 2.24134 5.03573 2.24134C5.29872 2.24134 5.51192 2.44003 5.51192 2.68513ZM6.94049 3.12892C7.20348 3.12892 7.41668 2.93023 7.41668 2.68513C7.41668 2.44003 7.20348 2.24134 6.94049 2.24134C6.6775 2.24134 6.4643 2.44003 6.4643 2.68513C6.4643 2.93023 6.6775 3.12892 6.94049 3.12892ZM8.36906 3.57271C8.36906 3.81781 8.15586 4.0165 7.89287 4.0165C7.62988 4.0165 7.41668 3.81781 7.41668 3.57271C7.41668 3.32761 7.62988 3.12892 7.89287 3.12892C8.15586 3.12892 8.36906 3.32761 8.36906 3.57271ZM5.98811 4.0165C6.2511 4.0165 6.4643 3.81781 6.4643 3.57271C6.4643 3.32761 6.2511 3.12892 5.98811 3.12892C5.72511 3.12892 5.51192 3.32761 5.51192 3.57271C5.51192 3.81781 5.72511 4.0165 5.98811 4.0165ZM4.55954 3.57271C4.55954 3.81781 4.34634 4.0165 4.08334 4.0165C3.82035 4.0165 3.60715 3.81781 3.60715 3.57271C3.60715 3.32761 3.82035 3.12892 4.08334 3.12892C4.34634 3.12892 4.55954 3.32761 4.55954 3.57271ZM2.17858 4.0165C2.44158 4.0165 2.65477 3.81781 2.65477 3.57271C2.65477 3.32761 2.44158 3.12892 2.17858 3.12892C1.91559 3.12892 1.70239 3.32761 1.70239 3.57271C1.70239 3.81781 1.91559 4.0165 2.17858 4.0165ZM3.60715 4.46029C3.60715 4.70538 3.39396 4.90408 3.13096 4.90408C2.86797 4.90408 2.65477 4.70538 2.65477 4.46029C2.65477 4.21519 2.86797 4.0165 3.13096 4.0165C3.39396 4.0165 3.60715 4.21519 3.60715 4.46029ZM5.03573 4.90408C5.29872 4.90408 5.51192 4.70538 5.51192 4.46029C5.51192 4.21519 5.29872 4.0165 5.03573 4.0165C4.77273 4.0165 4.55954 4.21519 4.55954 4.46029C4.55954 4.70538 4.77273 4.90408 5.03573 4.90408ZM7.41668 4.46029C7.41668 4.70538 7.20348 4.90408 6.94049 4.90408C6.6775 4.90408 6.4643 4.70538 6.4643 4.46029C6.4643 4.21519 6.6775 4.0165 6.94049 4.0165C7.20348 4.0165 7.41668 4.21519 7.41668 4.46029ZM7.89287 5.79166C8.15586 5.79166 8.36906 5.59296 8.36906 5.34787C8.36906 5.10277 8.15586 4.90408 7.89287 4.90408C7.62988 4.90408 7.41668 5.10277 7.41668 5.34787C7.41668 5.59296 7.62988 5.79166 7.89287 5.79166ZM6.4643 5.34787C6.4643 5.59296 6.2511 5.79166 5.98811 5.79166C5.72511 5.79166 5.51192 5.59296 5.51192 5.34787C5.51192 5.10277 5.72511 4.90408 5.98811 4.90408C6.2511 4.90408 6.4643 5.10277 6.4643 5.34787ZM4.08334 5.79166C4.34634 5.79166 4.55954 5.59296 4.55954 5.34787C4.55954 5.10277 4.34634 4.90408 4.08334 4.90408C3.82035 4.90408 3.60715 5.10277 3.60715 5.34787C3.60715 5.59296 3.82035 5.79166 4.08334 5.79166ZM2.65477 5.34787C2.65477 5.59296 2.44158 5.79166 2.17858 5.79166C1.91559 5.79166 1.70239 5.59296 1.70239 5.34787C1.70239 5.10277 1.91559 4.90408 2.17858 4.90408C2.44158 4.90408 2.65477 5.10277 2.65477 5.34787Z"
fill="url(#paint0_linear_3422_20233)" />
</g>
</g>
<defs>
<filter id="filter0_d_3422_20233" x="1.70239" y="1.35376" width="6.66675" height="5.43787"
filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="1" />
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_3422_20233" />
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_3422_20233" result="shape" />
</filter>
<linearGradient id="paint0_linear_3422_20233" x1="1.70239" y1="1.35376" x2="1.70239" y2="5.79166"
gradientUnits="userSpaceOnUse">
<stop stop-color="white" />
<stop offset="1" stop-color="#F0F0F0" />
</linearGradient>
</defs>
</svg>
English (US)
<svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
</svg></button>
<div id="dropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-sm shadow-sm w-44 dark:bg-gray-700"
data-popper-placement="bottom"
style="position: absolute; inset: 0px auto auto 0px; margin: 0px; transform: translate3d(911px, 681.5px, 0px);">
<ul class="py-1 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefault">
<li>
<a href="#"
class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">English</a>
</li>
<li>
<a href="#"
class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">German</a>
</li>
<li>
<a href="#"
class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Italian</a>
</li>
<li>
<a href="#"
class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Spanish</a>
</li>
</ul>
</div>
</div>
</div>
</footer>