This repository has been archived on 2024-11-13. You can view files and clone it, but cannot push or open issues or pull requests.
fediversity.eu/public/index.html
2024-04-02 11:12:11 +02:00

2678 lines
47 KiB
HTML

<!doctype html>
<html
itemscope
class=""
lang="en-us"
itemtype="http://schema.org/WebPage"
>
<head>
<meta name="generator" content="Hugo 0.124.1"><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=5"
/>
<meta name="theme-name" content="hugoplate" />
<link rel="shortcut icon" href="/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_96x0_resize_lanczos_3.png" type="image/x-icon">
<link rel="icon" href="/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_96x0_resize_lanczos_3.png" type="image/x-icon">
<link rel="icon" type="image/png" sizes="48x48" href="/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_48x0_resize_lanczos_3.png">
<link rel="icon" type="image/png" sizes="96x96" href="/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_96x0_resize_lanczos_3.png">
<link rel="apple-touch-icon" sizes="144x144" href="/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_144x0_resize_lanczos_3.png">
<link rel="manifest" href="/manifest.webmanifest" />
<meta
name="msapplication-TileColor"
content="#ddd" />
<meta
name="theme-color"
content="#ffffff" />
<base href="//localhost:1313/" />
<title>Fediversity</title>
<meta
name="keywords"
content="Boilerplate, Hugo" />
<meta
name="description"
content="Hugo &amp; Tailwindcss Starter" />
<meta name="author" content="zeon.studio" />
<meta property="og:image" content="//localhost:1313/images/og-image.png" />
<meta name="twitter:image" content="//localhost:1313/images/og-image.png" />
<meta
name="twitter:card"
content="summary
_large_image
" />
<meta property="og:image:width" content="900" />
<meta property="og:image:height" content="600" />
<meta
property="og:image:type"
content="image/
.png
" />
<meta property="og:title" content="Fediversity" />
<meta property="og:description" content="Hugo &amp; Tailwindcss Starter" />
<meta property="og:type" content="website" />
<meta property="og:url" content="//localhost:1313/" />
<meta name="twitter:title" content="Fediversity" />
<meta name="twitter:description" content="Hugo &amp; Tailwindcss Starter" />
<script>
let indexURL = "//localhost:1313/searchindex.json";
let includeSectionsInSearch = ["blog"];
let no_results_for = "No results for";
let empty_search_results_placeholder = "Type something to search..";
</script>
<meta http-equiv="x-dns-prefetch-control" content="on" />
<link rel="preconnect" href="https://use.fontawesome.com" crossorigin />
<link rel="preconnect" href="//cdnjs.cloudflare.com" />
<link rel="preconnect" href="//www.googletagmanager.com" />
<link rel="preconnect" href="//www.google-analytics.com" />
<link rel="dns-prefetch" href="https://use.fontawesome.com" />
<link rel="dns-prefetch" href="//ajax.googleapis.com" />
<link rel="dns-prefetch" href="//cdnjs.cloudflare.com" />
<link rel="dns-prefetch" href="//www.googletagmanager.com" />
<link rel="dns-prefetch" href="//www.google-analytics.com" />
<link rel="dns-prefetch" href="//fonts.googleapis.com" />
<link rel="dns-prefetch" href="//connect.facebook.net" />
<link rel="dns-prefetch" href="//platform.linkedin.com" />
<link rel="dns-prefetch" href="//platform.twitter.com" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<script>
(function () {
const googleFont = document.createElement("link");
googleFont.href =
"https://fonts.googleapis.com/css2?family=Heebo:wght@400;600&family=Signika:wght@500;700&display=swap";
googleFont.type = "text/css";
googleFont.rel = "stylesheet";
document.head.appendChild(googleFont);
})();
</script>
<link
href="/css/style.css"
integrity=""
rel="stylesheet"
/>
<link
defer
async
rel="stylesheet"
href="/css/style-lazy.css"
integrity=""
media="print"
onload="this.media='all'; this.onload=null;"
/>
</head>
<body>
<div
class="fixed left-0 top-0 z-50 flex w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200"
>
<span class="block sm:hidden">all</span>
<span class="hidden sm:block md:hidden">sm</span>
<span class="hidden md:block lg:hidden">md</span>
<span class="hidden lg:block xl:hidden">lg</span>
<span class="hidden xl:block 2xl:hidden">xl</span>
<span class="hidden 2xl:block">2xl</span>
</div>
<header
class="header sticky top-0 z-30"
>
<nav class="navbar container">
<div class="order-0">
<a class="navbar-brand block" href="/">
<img
fetchpriority="high"
decoding="async"
class="img logo-light"
width="160"
height="32"
src="/images/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
<img
fetchpriority="high"
decoding="async"
class="img logo-dark"
width="160"
height="32"
src="/images/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
</a>
</div>
<input id="nav-toggle" type="checkbox" class="hidden" />
<label
for="nav-toggle"
class="order-3 cursor-pointer flex items-center lg:hidden text-dark lg:order-1"
>
<svg id="show-button" class="h-6 fill-current block" viewBox="0 0 20 20">
<title>Menu Open</title>
<path d="M0 3h20v2H0V3z m0 6h20v2H0V9z m0 6h20v2H0V0z"></path>
</svg>
<svg id="hide-button" class="h-6 fill-current hidden" viewBox="0 0 20 20">
<title>Menu Close</title>
<polygon
points="11 9 22 9 22 11 11 11 11 22 9 22 9 11 -2 11 -2 9 9 9 9 -2 11 -2"
transform="rotate(45 10 10)"
></polygon>
</svg>
</label>
<ul
id="nav-menu"
class="navbar-nav order-3 hidden lg:flex w-full pb-6 lg:order-1 lg:w-auto lg:space-x-2 lg:pb-0 xl:space-x-8"
>
<li class="nav-item nav-dropdown group relative">
<span
class="nav-link
inline-flex items-center"
>
For You
<svg class="h-4 w-4 fill-current" viewBox="0 0 20 20">
<path
d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"
/>
</svg>
</span>
<ul
class="nav-dropdown-list lg:group-hover:visible lg:group-hover:opacity-100"
>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/developers/"
>
Developers
</a>
</li>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/ec/"
>
European Commission
</a>
</li>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/individuals/"
>
Individuals
</a>
</li>
</ul>
</li>
<li class="nav-item nav-dropdown group relative">
<span
class="nav-link
inline-flex items-center"
>
Consortium
<svg class="h-4 w-4 fill-current" viewBox="0 0 20 20">
<path
d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"
/>
</svg>
</span>
<ul
class="nav-dropdown-list lg:group-hover:visible lg:group-hover:opacity-100"
>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/nlnet/"
>
NLnet
</a>
</li>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/nordunet/"
>
NORDUnet
</a>
</li>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/oid/"
>
Open Internet Discourse
</a>
</li>
<li class="nav-dropdown-item">
<a
class="nav-dropdown-link "
href="/tweag/"
>
Tweag
</a>
</li>
</ul>
</li>
<li class="nav-item">
<a
class="nav-link "
href="/fediversity/"
>Fediversity</a
>
</li>
<li class="nav-item">
<a
class="nav-link "
href="/grants/"
>Grants</a
>
</li>
<li class="nav-item">
<a
class="nav-link active"
href="/"
>Events</a
>
</li>
<li class="nav-item">
<a
class="nav-link active"
href="/"
>News</a
>
</li>
<li class="mt-4 inline-block lg:hidden">
<a
class="btn btn-outline-primary btn-sm"
href="/contact"
>
Contact
</a>
</li>
</ul>
<div class="order-1 ml-auto flex items-center md:order-2 lg:ml-0">
<button
aria-label="search"
class="border-border text-dark hover:text-primary mr-5 inline-block border-r pr-5 text-xl"
data-target="search-modal"
>
<i class="fa-solid fa-search"></i>
</button>
<div class="theme-switcher mr-5">
<input id="theme-switcher" data-theme-switcher type="checkbox" />
<label for="theme-switcher">
<span class="sr-only">theme switcher</span>
<span>
<svg
class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10 opacity-100"
viewBox="0 0 56 56"
fill="#fff"
height="16"
width="16"
>
<path
d="M30 4.6c0-1-.9-2-2-2a2 2 0 0 0-2 2v5c0 1 .9 2 2 2s2-1 2-2Zm9.6 9a2 2 0 0 0 0 2.8c.8.8 2 .8 2.9 0L46 13a2 2 0 0 0 0-2.9 2 2 0 0 0-3 0Zm-26 2.8c.7.8 2 .8 2.8 0 .8-.7.8-2 0-2.9L13 10c-.7-.7-2-.8-2.9 0-.7.8-.7 2.1 0 3ZM28 16a12 12 0 0 0-12 12 12 12 0 0 0 12 12 12 12 0 0 0 12-12 12 12 0 0 0-12-12Zm23.3 14c1.1 0 2-.9 2-2s-.9-2-2-2h-4.9a2 2 0 0 0-2 2c0 1.1 1 2 2 2ZM4.7 26a2 2 0 0 0-2 2c0 1.1.9 2 2 2h4.9c1 0 2-.9 2-2s-1-2-2-2Zm37.8 13.6a2 2 0 0 0-3 0 2 2 0 0 0 0 2.9l3.6 3.5a2 2 0 0 0 2.9 0c.8-.8.8-2.1 0-3ZM10 43.1a2 2 0 0 0 0 2.9c.8.7 2.1.8 3 0l3.4-3.5c.8-.8.8-2.1 0-2.9-.8-.8-2-.8-2.9 0Zm20 3.4c0-1.1-.9-2-2-2a2 2 0 0 0-2 2v4.9c0 1 .9 2 2 2s2-1 2-2Z"
/>
</svg>
<svg
class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10 opacity-0"
viewBox="0 0 24 24"
fill="none"
height="16"
width="16"
>
<path
fill="#000"
fill-rule="evenodd"
clip-rule="evenodd"
d="M8.2 2.2c1-.4 2 .6 1.6 1.5-1 3-.4 6.4 1.8 8.7a8.4 8.4 0 0 0 8.7 1.8c1-.3 2 .5 1.5 1.5v.1a10.3 10.3 0 0 1-9.4 6.2A10.3 10.3 0 0 1 3.2 6.7c1-2 2.9-3.5 4.9-4.4Z"
/>
</svg>
</span>
</label>
</div>
<script>
var darkMode = false;
if (window.matchMedia("(prefers-color-scheme: dark)").matches){darkMode = true}
if (localStorage.getItem("theme") === "dark"){darkMode = true}
else if (localStorage.getItem("theme") === "light"){darkMode = false}
if (darkMode){document.documentElement.classList.toggle("dark")}
var themeSwitch = document.querySelectorAll("[data-theme-switcher]");
document.addEventListener("DOMContentLoaded", () => {
[].forEach.call(themeSwitch, function (ts) {
ts.checked = darkMode ? true : false;
ts.addEventListener("click", () => {
document.documentElement.classList.toggle("dark");
localStorage.setItem(
"theme",
document.documentElement.classList.contains("dark") ? "dark" : "light"
);
});
});
});
</script>
<a
href="/contact"
class="btn btn-outline-primary btn-sm hidden lg:inline-block"
>
Contact
</a>
</div>
</nav>
</header>
<div
class="search-modal "
aria-hidden="true"
style="--color-primary: #121212">
<div data-target="close-search-modal" class="search-modal-overlay"></div>
<div
class="search-wrapper"
data-image="true"
data-description="true"
data-tags="true"
data-categories="true">
<div class="search-wrapper-header">
<label for="search-modal-input" style="margin-top:-1px">
<span class="sr-only">search icon</span>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
height="18"
width="18"
class="search-icon"
data-type="search">
<path
fill="currentColor"
d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z" />
</svg>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
height="18"
width="18"
class="search-reset"
data-type="reset">
<path
fill="currentColor"
d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z" />
</svg>
</label>
<input
id="search-modal-input"
type="text"
data-search-input
autocomplete="off"
aria-label="Search"
placeholder="Search Post ..." />
</div>
<div class="search-wrapper-body">
<div class="search-result" data-search-result></div>
<span class="search-result-empty">
Type something to search..
</span>
</div>
<div class="search-wrapper-footer">
<span>
<kbd>
<svg
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
fill="currentColor"
viewBox="0 0 16 16">
<path
d="M3.204 11h9.592L8 5.519 3.204 11zm-.753-.659 4.796-5.48a1 1 0 0 1 1.506 0l4.796 5.48c.566.647.106 1.659-.753 1.659H3.204a1 1 0 0 1-.753-1.659z" />
</svg>
</kbd>
<kbd>
<svg
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
fill="currentColor"
style="margin-top:1px;"
viewBox="0 0 16 16">
<path
d="M3.204 5h9.592L8 10.481 3.204 5zm-.753.659 4.796 5.48a1 1 0 0 0 1.506 0l4.796-5.48c.566-.647.106-1.659-.753-1.659H3.204a1 1 0 0 0-.753 1.659z" />
</svg>
</kbd>
to navigate
</span>
<span>
<kbd>
<svg
xmlns="http://www.w3.org/2000/svg"
width="12"
height="12"
fill="currentColor"
style="display:inline-block;"
viewBox="0 0 16 16">
<path
fill-rule="evenodd"
d="M14.5 1.5a.5.5 0 0 1 .5.5v4.8a2.5 2.5 0 0 1-2.5 2.5H2.707l3.347 3.346a.5.5 0 0 1-.708.708l-4.2-4.2a.5.5 0 0 1 0-.708l4-4a.5.5 0 1 1 .708.708L2.707 8.3H12.5A1.5 1.5 0 0 0 14 6.8V2a.5.5 0 0 1 .5-.5z" />
</svg>
</kbd>
to select
</span>
<span class="search-result-info"></span>
<span data-target="close-search-modal">
<kbd>ESC</kbd> to close
</span>
</div>
</div>
</div>
<main>
<section class="section pt-14">
<div class="container">
<div class="row justify-center">
<div class="lg:col-7 md:col-9 mb-8 text-center">
<h1 class="mb-4 text-h3 lg:text-h1">Welcome to the Fediversity Project</h1>
<p class="mb-8">The Fediversity Project is a comprehensive effort to bring easy-to-use, hosted cloud services that have service portability and personal freedom at their core to everyone.</p>
<a
class="btn btn-primary"
href="//localhost:1313/individuals"
>
For You
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
<div class="col-12">
<picture>
<source
srcset="/images/checkbox-illustration_hucb4a9deb3a7719a69f6f89f2eb591f34_30800_545x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 575px)" />
<source
srcset="/images/checkbox-illustration_hucb4a9deb3a7719a69f6f89f2eb591f34_30800_600x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 767px)" />
<source
srcset="/images/checkbox-illustration_hucb4a9deb3a7719a69f6f89f2eb591f34_30800_700x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 991px)" />
<source
srcset="/images/checkbox-illustration_hucb4a9deb3a7719a69f6f89f2eb591f34_30800_800x0_resize_q80_h2_lanczos_3.webp"
/>
<img
loading="eager" decoding="async"
src="/images/checkbox-illustration_hucb4a9deb3a7719a69f6f89f2eb591f34_30800_800x0_resize_lanczos_3.png"
class=" mx-auto lg:!max-w-[800px] img"
alt="Banner image"
width="962"
height="728" />
</picture>
</div>
</div>
</div>
</section>
<section class="section-sm bg-gradient">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0 md:col-5 mb-6"
>
<img
src="/images/users_hu02aadac476934b9056e529139f32f0f6_968_24x24_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async" alt="feature image"
class=" img"
width="24"
height="24"
onerror="this.onerror='null';this.src='\/images\/users.png';" />
</div>
<div
class=" md:col-7 lg:col-6"
>
<h2 class="mb-4">Consortium</h2>
<p class="mb-8 text-lg">The Consortium behind the Fediversity project is a cooperation between NLnet, Open Internet Discourse Foundation, NORDUnet and Tweag.</p>
<ul>
</ul>
</div>
</div>
</div>
</section>
<section class="section-sm ">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0
md:order-2
md:col-5 mb-6"
>
<img
src="/images/users_hu02aadac476934b9056e529139f32f0f6_968_24x24_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async" alt="feature image"
class=" img"
width="24"
height="24"
onerror="this.onerror='null';this.src='\/images\/users.png';" />
</div>
<div
class="
md:order-1
md:col-7 lg:col-6"
>
<h2 class="mb-4">NLnet</h2>
<p class="mb-8 text-lg">NLnet supports organisations and people who contribute to an open internet for all. They fund projects that help fix the internet through open hardware, open software, open standards, open science and open data.</p>
<ul>
</ul>
<a class="btn btn-primary mt-6" href="//localhost:1313/nlnet">
Learn more
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
</div>
</div>
</section>
<section class="section-sm bg-gradient">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0 md:col-5 mb-6"
>
<img
src="/images/users_hu02aadac476934b9056e529139f32f0f6_968_24x24_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async" alt="feature image"
class=" img"
width="24"
height="24"
onerror="this.onerror='null';this.src='\/images\/users.png';" />
</div>
<div
class=" md:col-7 lg:col-6"
>
<h2 class="mb-4">Open Internet Discourse</h2>
<p class="mb-8 text-lg">The Open Internet Discourse Foundation (OID) is founded on the belief that everyone deserves the freedom to express themselves and use the internet without constraints, and is committed to help build a better internet where individuals can truly be who they are.</p>
<ul>
</ul>
<a class="btn btn-primary mt-6" href="//localhost:1313/oid">
Learn more
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
</div>
</div>
</section>
<section class="section-sm ">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0
md:order-2
md:col-5 mb-6"
>
<img
src="/images/users_hu02aadac476934b9056e529139f32f0f6_968_24x24_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async" alt="feature image"
class=" img"
width="24"
height="24"
onerror="this.onerror='null';this.src='\/images\/users.png';" />
</div>
<div
class="
md:order-1
md:col-7 lg:col-6"
>
<h2 class="mb-4">Tweag</h2>
<p class="mb-8 text-lg">Tweag is the open source program office (OSPO) of Modus Create, and has extensive experience working with Nix, and many people at the forefront of the Nix community are Tweagers.</p>
<ul>
</ul>
<a class="btn btn-primary mt-6" href="//localhost:1313/tweag">
Learn more
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
</div>
</div>
</section>
<section class="section-sm bg-gradient">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0 md:col-5 mb-6"
>
<img
src="/images/users_hu02aadac476934b9056e529139f32f0f6_968_24x24_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async" alt="feature image"
class=" img"
width="24"
height="24"
onerror="this.onerror='null';this.src='\/images\/users.png';" />
</div>
<div
class=" md:col-7 lg:col-6"
>
<h2 class="mb-4">NORDUnet</h2>
<p class="mb-8 text-lg">NORDUnet is a collaboration of the National Research and Education Networks of the Nordic countries.</p>
<ul>
</ul>
<a class="btn btn-primary mt-6" href="//localhost:1313/nordunet">
Learn more
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
</div>
</div>
</section>
<section class="section-sm ">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0
md:order-2
md:col-5 mb-6"
>
<picture>
<source
srcset="/images/service-2_hub2400521e15639ea64d4f0700f2d9269_19596_545x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 575px)" />
<source
srcset="/images/service-2_hub2400521e15639ea64d4f0700f2d9269_19596_360x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 767px)" />
<source
srcset="/images/service-2_hub2400521e15639ea64d4f0700f2d9269_19596_425x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 991px)" />
<source
srcset="/images/service-2_hub2400521e15639ea64d4f0700f2d9269_19596_520x0_resize_q80_h2_lanczos_3.webp"
/>
<img
loading="lazy" decoding="async"
src="/images/service-2_hub2400521e15639ea64d4f0700f2d9269_19596_520x0_resize_lanczos_3.png"
class=" img"
alt="feature image"
width="548"
height="526" />
</picture>
</div>
<div
class="
md:order-1
md:col-7 lg:col-6"
>
<h2 class="mb-4">Discover the Key Features Of Hugo</h2>
<p class="mb-8 text-lg">Hugo is an all-in-one web framework for building fast, content-focused websites. It offers a range of exciting features for developers and website creators. Some of the key features are:</p>
<ul>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
Zero JS, by default: No JavaScript runtime overhead to slow you down.
</li>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
Customizable: Tailwind, MDX, and 100+ other integrations to choose from.
</li>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
UI-agnostic: Supports React, Preact, Svelte, Vue, Solid, Lit and more.
</li>
</ul>
<a class="btn btn-primary mt-6" href="https://github.com/zeon-studio/hugoplate">
Get Started Now
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
</div>
</div>
</section>
<section class="section-sm bg-gradient">
<div class="container">
<div class="row items-center justify-between">
<div
class="mb:md-0 md:col-5 mb-6"
>
<picture>
<source
srcset="/images/service-3_hu253be68c312fbd4b154613c4276f36e3_16481_545x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 575px)" />
<source
srcset="/images/service-3_hu253be68c312fbd4b154613c4276f36e3_16481_360x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 767px)" />
<source
srcset="/images/service-3_hu253be68c312fbd4b154613c4276f36e3_16481_425x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 991px)" />
<source
srcset="/images/service-3_hu253be68c312fbd4b154613c4276f36e3_16481_520x0_resize_q80_h2_lanczos_3.webp"
/>
<img
loading="lazy" decoding="async"
src="/images/service-3_hu253be68c312fbd4b154613c4276f36e3_16481_520x0_resize_lanczos_3.png"
class=" img"
alt="feature image"
width="532"
height="433" />
</picture>
</div>
<div
class=" md:col-7 lg:col-6"
>
<h2 class="mb-4">The Top Reasons to Choose Hugo for Your Hugo Project</h2>
<p class="mb-8 text-lg">With Hugo, you can build modern and content-focused websites without sacrificing performance or ease of use.</p>
<ul>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
Instantly load static sites for better user experience and SEO.
</li>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
Intuitive syntax and support for popular frameworks make learning and using Hugo a breeze.
</li>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
Use any front-end library or framework, or build custom components, for any project size.
</li>
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
Built on cutting-edge technology to keep your projects up-to-date with the latest web standards.
</li>
</ul>
</div>
</div>
</div>
</section>
<section class="section">
<div class="container">
<div class="row">
<div class="md:col-10 lg:col-8 xl:col-6 mx-auto mb-12 text-center">
<h2 class="mb-4">What Users Are Saying About Hugoplate</h2>
<p>Don&rsquo;t just take our word for it - hear from some of our satisfied users! Check out some of our testimonials below to see what others are saying about Hugoplate.</p>
</div>
<div class="col-12">
<div class="swiper testimonial-slider">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="bg-theme-light rounded-lg px-7 py-10">
<div class="text-dark">
<svg
width="33"
height="20"
viewBox="0 0 33 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.28375 19.41L0.79375 18.64C1.21375 17.0067 1.75042 15.07 2.40375 12.83C3.05708 10.5433 3.75708 8.28 4.50375 6.04C5.29708 3.75333 6.06708 1.77 6.81375 0.0899959H15.3538C14.9338 2.09666 14.4904 4.26667 14.0238 6.6C13.5571 8.88666 13.1371 11.15 12.7638 13.39C12.4371 15.5833 12.1571 17.59 11.9238 19.41H1.28375ZM31.69 0.0899959L32.18 0.859998C31.76 2.54 31.2233 4.5 30.57 6.74C29.9167 8.98 29.2167 11.2433 28.47 13.53C27.7233 15.77 26.9533 17.73 26.16 19.41H17.69C18.0167 17.9167 18.3433 16.33 18.67 14.65C18.9967 12.9233 19.3 11.22 19.58 9.54C19.9067 7.81333 20.1867 6.15667 20.42 4.57C20.7 2.93666 20.91 1.44333 21.05 0.0899959H31.69Z"
fill="currentColor"
/>
</svg>
</div>
<blockquote class="mt-8">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui iusto illo molestias, assumenda expedita commodi inventore non itaque molestiae voluptatum dolore, facilis sapiente, repellat veniam.
</blockquote>
<div class="mt-11 flex items-center">
<div class="text-dark">
<img
src="/images/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async"
alt="Marvin McKinney"
class=" rounded-full img"
width="50"
height="50"
onerror="this.onerror='null';
this.src='\/images\/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_lanczos_3.png';" />
</div>
<div class="ml-4">
<h3 class="h5 font-primary font-semibold">Marvin McKinney</h3>
<p class="text-dark">Web Designer</p>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="bg-theme-light rounded-lg px-7 py-10">
<div class="text-dark">
<svg
width="33"
height="20"
viewBox="0 0 33 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.28375 19.41L0.79375 18.64C1.21375 17.0067 1.75042 15.07 2.40375 12.83C3.05708 10.5433 3.75708 8.28 4.50375 6.04C5.29708 3.75333 6.06708 1.77 6.81375 0.0899959H15.3538C14.9338 2.09666 14.4904 4.26667 14.0238 6.6C13.5571 8.88666 13.1371 11.15 12.7638 13.39C12.4371 15.5833 12.1571 17.59 11.9238 19.41H1.28375ZM31.69 0.0899959L32.18 0.859998C31.76 2.54 31.2233 4.5 30.57 6.74C29.9167 8.98 29.2167 11.2433 28.47 13.53C27.7233 15.77 26.9533 17.73 26.16 19.41H17.69C18.0167 17.9167 18.3433 16.33 18.67 14.65C18.9967 12.9233 19.3 11.22 19.58 9.54C19.9067 7.81333 20.1867 6.15667 20.42 4.57C20.7 2.93666 20.91 1.44333 21.05 0.0899959H31.69Z"
fill="currentColor"
/>
</svg>
</div>
<blockquote class="mt-8">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui iusto illo molestias, assumenda expedita commodi inventore non itaque molestiae voluptatum dolore, facilis sapiente, repellat veniam.
</blockquote>
<div class="mt-11 flex items-center">
<div class="text-dark">
<img
src="/images/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async"
alt="Marvin McKinney"
class=" rounded-full img"
width="50"
height="50"
onerror="this.onerror='null';
this.src='\/images\/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_lanczos_3.png';" />
</div>
<div class="ml-4">
<h3 class="h5 font-primary font-semibold">Marvin McKinney</h3>
<p class="text-dark">Web Designer</p>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="bg-theme-light rounded-lg px-7 py-10">
<div class="text-dark">
<svg
width="33"
height="20"
viewBox="0 0 33 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.28375 19.41L0.79375 18.64C1.21375 17.0067 1.75042 15.07 2.40375 12.83C3.05708 10.5433 3.75708 8.28 4.50375 6.04C5.29708 3.75333 6.06708 1.77 6.81375 0.0899959H15.3538C14.9338 2.09666 14.4904 4.26667 14.0238 6.6C13.5571 8.88666 13.1371 11.15 12.7638 13.39C12.4371 15.5833 12.1571 17.59 11.9238 19.41H1.28375ZM31.69 0.0899959L32.18 0.859998C31.76 2.54 31.2233 4.5 30.57 6.74C29.9167 8.98 29.2167 11.2433 28.47 13.53C27.7233 15.77 26.9533 17.73 26.16 19.41H17.69C18.0167 17.9167 18.3433 16.33 18.67 14.65C18.9967 12.9233 19.3 11.22 19.58 9.54C19.9067 7.81333 20.1867 6.15667 20.42 4.57C20.7 2.93666 20.91 1.44333 21.05 0.0899959H31.69Z"
fill="currentColor"
/>
</svg>
</div>
<blockquote class="mt-8">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui iusto illo molestias, assumenda expedita commodi inventore non itaque molestiae voluptatum dolore, facilis sapiente, repellat veniam.
</blockquote>
<div class="mt-11 flex items-center">
<div class="text-dark">
<img
src="/images/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async"
alt="Marvin McKinney"
class=" rounded-full img"
width="50"
height="50"
onerror="this.onerror='null';
this.src='\/images\/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_lanczos_3.png';" />
</div>
<div class="ml-4">
<h3 class="h5 font-primary font-semibold">Marvin McKinney</h3>
<p class="text-dark">Web Designer</p>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="bg-theme-light rounded-lg px-7 py-10">
<div class="text-dark">
<svg
width="33"
height="20"
viewBox="0 0 33 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.28375 19.41L0.79375 18.64C1.21375 17.0067 1.75042 15.07 2.40375 12.83C3.05708 10.5433 3.75708 8.28 4.50375 6.04C5.29708 3.75333 6.06708 1.77 6.81375 0.0899959H15.3538C14.9338 2.09666 14.4904 4.26667 14.0238 6.6C13.5571 8.88666 13.1371 11.15 12.7638 13.39C12.4371 15.5833 12.1571 17.59 11.9238 19.41H1.28375ZM31.69 0.0899959L32.18 0.859998C31.76 2.54 31.2233 4.5 30.57 6.74C29.9167 8.98 29.2167 11.2433 28.47 13.53C27.7233 15.77 26.9533 17.73 26.16 19.41H17.69C18.0167 17.9167 18.3433 16.33 18.67 14.65C18.9967 12.9233 19.3 11.22 19.58 9.54C19.9067 7.81333 20.1867 6.15667 20.42 4.57C20.7 2.93666 20.91 1.44333 21.05 0.0899959H31.69Z"
fill="currentColor"
/>
</svg>
</div>
<blockquote class="mt-8">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui iusto illo molestias, assumenda expedita commodi inventore non itaque molestiae voluptatum dolore, facilis sapiente, repellat veniam.
</blockquote>
<div class="mt-11 flex items-center">
<div class="text-dark">
<img
src="/images/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_q80_h2_lanczos_3.webp" loading="lazy"
decoding="async"
alt="Marvin McKinney"
class=" rounded-full img"
width="50"
height="50"
onerror="this.onerror='null';
this.src='\/images\/avatar-sm_hu9f327c832418412c3223cac273682ad9_4005_50x50_resize_lanczos_3.png';" />
</div>
<div class="ml-4">
<h3 class="h5 font-primary font-semibold">Marvin McKinney</h3>
<p class="text-dark">Web Designer</p>
</div>
</div>
</div>
</div>
</div>
<div
class="testimonial-slider-pagination mt-9 flex items-center justify-center text-center"
></div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="bg-theme-light">
<div class="container">
<div class="row items-center py-10">
<div class="lg:col-3 mb-8 text-center lg:mb-0 lg:text-left">
<a
class="navbar-brand inline-block"
href="/"
>
<img
fetchpriority="high"
decoding="async"
class="img logo-light"
width="160"
height="32"
src="/images/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
<img
fetchpriority="high"
decoding="async"
class="img logo-dark"
width="160"
height="32"
src="/images/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
</a>
</div>
<div class="lg:col-6 mb-8 text-center lg:mb-0">
<ul>
<li class="m-3 inline-block">
<a
href="
/about/
"
>About</a
>
</li>
<li class="m-3 inline-block">
<a
href="
/elements/
"
>Elements</a
>
</li>
<li class="m-3 inline-block">
<a
href="
/privacy-policy/
"
>Privacy Policy</a
>
</li>
</ul>
</div>
<div class="lg:col-3 mb-8 text-center lg:mb-0 lg:mt-0 lg:text-right">
<ul class="social-icons">
<li>
<a
target="_blank"
aria-label="facebook"
rel="nofollow noopener"
href="https://www.facebook.com/"
>
<i class="fab fa-facebook"></i>
</a>
</li>
<li>
<a
target="_blank"
aria-label="twitter"
rel="nofollow noopener"
href="https://twitter.com/"
>
<i class="fab fa-twitter"></i>
</a>
</li>
<li>
<a
target="_blank"
aria-label="github"
rel="nofollow noopener"
href="https://www.github.com/"
>
<i class="fab fa-github"></i>
</a>
</li>
<li>
<a
target="_blank"
aria-label="linkedin"
rel="nofollow noopener"
href="https://www.linkedin.com/"
>
<i class="fab fa-linkedin"></i>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="border-border border-t py-7">
<div class="text-light container text-center">
<p>Designed &amp; Developed by <a href="https://zeon.studio"
target="_blank"
>Zeon Studio</a></p>
</div>
</div>
</footer>
<script
crossorigin="anonymous"
integrity=""
src="/js/script.js"
></script>
<script
defer
async
crossorigin="anonymous"
integrity=""
src="/js/script-lazy.js"
></script>
<script>
if ('serviceWorker' in navigator){navigator.serviceWorker.register("/service-worker.js");}
</script>
</body>
</html>