<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{{{ title }}} - Human-friendly HSL</title>
    <meta name="description" content="HSLuv - An alternative to HSL for programmatic color generation">
    <meta name="author" content="Alexei Boronine">
    <meta name="viewport" content="width=device-width">
    <meta property="og:title" content="{{{ title }}} - Human-friendly HSL">
    <meta property="og:image" content="https://www.hsluv.org/static/images/avatar200.jpeg">
    <link rel="preload" href="/static/css/min.min.css" as="style">
    <link rel="preload" href="/static/css/main.css" as="style">
    <link rel="stylesheet" href="/static/css/min.min.css">
    <link rel="stylesheet" href="/static/css/main.css">
    <link rel="shortcut icon" href="/favicon.png"/>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-CSY31B6433"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'G-CSY31B6433');
    </script>
</head>

<body class="{{ bodyClass }}">
<nav id="header">
    <nav class="container" role="navigation">
        <div class="github-button">
            <iframe src="https://ghbtns.com/github-btn.html?user=hsluv&repo=hsluv&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px" title="Star on GitHub"></iframe>
        </div>
        <a class="logo" href="/">HSLuv</a>
        <a href="/comparison/">Comparison</a>
        <a href="/implementations/">Implementations</a>
        <a href="/math/">Math</a>
        <a href="/examples/">Examples</a>
        <a href="https://github.com/orgs/hsluv/discussions">Discussions</a>
        <a href="/credits/">Credits</a>
    </nav>
</nav>

<main class="container">
    {{{ content }}}
    <div class="row">
        <footer class="col c12">
            © Copyright 2024 by <a href="https://www.boronine.com">Alexei Boronine</a>.
        </footer>
    </div>
</main>

</body>
</html>
