CINXE.COM

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>For designers | Kirby CMS</title> <link href="https://assets.getkirby.com/assets/dist/css/index.1744033384.css" rel="stylesheet"><script src="https://assets.getkirby.com/assets/dist/js/index.1744033384.js" type="module"></script> <link rel="icon" type="image/png" href="https://assets.getkirby.com/assets/images/favicon.1704303350.png"> <link rel="icon" type="image/svg+xml" href="https://assets.getkirby.com/assets/images/favicon.1704303350.svg"> <link rel="mask-icon" href="https://assets.getkirby.com/assets/images/safari-mask-icon.1704303350.svg" color="#000"> <link href="https://getkirby.com/releases.rss" rel="alternate" type="application/rss+xml" title="Kirby Releases" /> <link href="https://getkirby.com/kosmos.rss" rel="alternate" type="application/rss+xml" title="Kirby Kosmos Archive" /> <link rel="manifest" href="https://getkirby.com/app.webmanifest" /> <link href="https://getkirby.com/for/designers" rel="canonical"> <script type="application/ld+json"> { "@context": "https://schema.org", "@graph": [ { "@type": "Organization", "name": "Kirby", "url": "https://getkirby.com", "logo": "https://assets.getkirby.com/assets/images/kirby-signet.1704303350.svg", "sameAs": [ "https://mastodon.social/@getkirby", "https://bsky.app/profile/getkirby.com", "https://www.linkedin.com/company/getkirby" ] }, { "@type": "WebSite", "url": "https://getkirby.com", "potentialAction": [ { "@type": "SearchAction", "target": "https://getkirby.com/search?q={search_term_string}", "query-input": "required name=search_term_string" } ] } ] }</script><link href="https://getkirby.com/open-search.xml" rel="search" title="Kirby CMS" type="application/opensearchdescription+xml"> <meta name="description" content="Staying out of your way: Kirby provides timeless simplicity in design and code"> <meta property="og:site_name" content="Kirby CMS"> <meta property="og:url" content="https://getkirby.com/for/designers"> <meta property="og:type" content="website"> <meta property="og:title" content="For designers"> <meta property="og:description" content="Staying out of your way: Kirby provides timeless simplicity in design and code"> <meta property="og:image" content="https://getkirby.com/for/designers/opengraph.png"> <link href="https://assets.getkirby.com/assets/dist/css/layouts/features.1744033384.css" rel="stylesheet"></head> <body> <div class="container"> <a href="/releases/5" class="topbar"> <span class="topbar-title"> <span class="topbar-icon">👀</span> Get a glimpse of Kirby 5 </span> <span class="topbar-link" data-active="false"> <span>Learn more</span> </span> </a> </div> <header class="header"> <a class="skipper btn btn--filled" href="#main">Skip to content</a> <div class="container"> <div class="header-content relative flex items-center"> <a class="logo" href="/"> <?xml version="1.0"?> <svg role="img" aria-labelledby="kirby-cms-icon" viewBox="0 0 36 42"> <title id="kirby-cms-icon">Kirby CMS</title> <path d="M18,0 L36,10.4981014 L36,31.5018986 L18,42 L0,31.5018986 L0,10.4981014 L18,0 Z M2,11.6926791 L2,30.3073209 L18,39.6389666 L34,30.3073209 L34,11.6926791 L18,2.36103344 L2,11.6926791 Z"/> <polyline points="26 21 21 23.59 21 24 26 24 26 28 10 28 10 24 15 24 15 23.563 10 21 10 16 18 20.297 26 16"/> </svg> </a> <div class="menu ml-auto"> <input id="menu-check" type="checkbox"> <label tabindex="0" class="menu-toggle" for="menu-check" aria-label="Show / hide menu"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="bars" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z"/></svg> </label> <nav aria-label="Main menu"> <ul class="menu-1"> <li class="has-submenu"> <a href="https://getkirby.com/for/developers">The CMS</a> <ul class="menu-2"> <li><a href="https://getkirby.com/for/developers">For developers</a></li> <li><a href="https://getkirby.com/for/designers">For designers</a></li> <li><a href="https://getkirby.com/for/creators">For content creators</a></li> <li><a href="https://getkirby.com/for/clients">For clients & agencies</a></li> <li><hr /></li> <li><a href="https://getkirby.com/love">Showcase</a></li> <li><a href="https://getkirby.com/releases">Releases</a></li> <li><a class="is-external" href="https://feedback.getkirby.com">Feedback</a></li> </ul> </li> <li class="has-submenu"> <a href="https://getkirby.com/docs/guide/quickstart">Docs</a> <ul class="menu-2"> <li><a href="https://getkirby.com/docs/guide/quickstart">Guide</a></li> <li><a href="https://getkirby.com/docs/reference">Reference</a></li> <li><a href="https://getkirby.com/docs/cookbook">Cookbook</a></li> <li><a href="https://getkirby.com/docs/quicktips">Quicktips</a></li> <li><a class="is-external" href="https://www.youtube.com/kirbycasts">Screencasts</a></li> <li><a href="https://getkirby.com/docs/glossary">Glossary</a></li> </ul> </li> <li class="has-submenu"> <a href="https://getkirby.com/kosmos">Resources</a> <ul class="menu-2"> <li><a class="is-external" href="https://plugins.getkirby.com">Plugins</a></li> <li><a href="https://getkirby.com/themes">Themes</a></li> <li><hr /></li> <li><a href="https://getkirby.com/kosmos">Newsletter</a></li> <li><a href="https://getkirby.com/buzz">Buzz</a></li> <li><hr /></li> <li><a class="is-external" href="https://hub.getkirby.com">License Hub</a></li> </ul> </li> <li class="has-submenu"> <a href="https://getkirby.com/meet">Community</a> <ul class="menu-2"> <li><a href="https://getkirby.com/meet">Get together</a></li> <li><hr /></li> <li><a class="is-external" href="https://forum.getkirby.com">Support forum</a></li> <li><a class="is-external" href="https://chat.getkirby.com">Discord chat</a></li> <li><a class="is-external" href="https://community.getkirby.com">Community map</a></li> <li><hr /></li> <li><a class="is-external" href="https://mastodon.social/@getkirby">Mastodon</a></li> <li><a class="is-external" href="https://www.linkedin.com/company/getkirby">LinkedIn</a></li> </ul> </li> <li><a class="partners" href="https://getkirby.com/partners">Partners</a></li> </ul> <ul class="menu-1 menu-steps"> <li><a href="https://getkirby.com/try">Try</a></li> <li> <a href="https://getkirby.com/love" aria-label="Love"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="heart" viewBox="0 0 24 24" aria-hidden="true"><path d="M12.001 4.52853C14.35 2.42 17.98 2.49 20.2426 4.75736C22.5053 7.02472 22.583 10.637 20.4786 12.993L11.9999 21.485L3.52138 12.993C1.41705 10.637 1.49571 7.01901 3.75736 4.75736C6.02157 2.49315 9.64519 2.41687 12.001 4.52853ZM18.827 6.1701C17.3279 4.66794 14.9076 4.60701 13.337 6.01687L12.0019 7.21524L10.6661 6.01781C9.09098 4.60597 6.67506 4.66808 5.17157 6.17157C3.68183 7.66131 3.60704 10.0473 4.97993 11.6232L11.9999 18.6543L19.0201 11.6232C20.3935 10.0467 20.319 7.66525 18.827 6.1701Z"/></svg> </a> </li> <li> <a href="https://getkirby.com/buy">Buy</a> </li> </ul> </nav> </div> <style> .search-input figure svg:last-child { animation: Spin .9s linear infinite; } @keyframes Spin { 100% { transform: rotate(360deg); } } form:not([data-fetching]) .search-input figure svg:last-child { display: none; } form[data-fetching] .search-input figure svg:first-child { display: none; } .search-footer svg { width: auto; } </style> <div class="search"> <button class="search-button" type="button" data-area="all" aria-label="Search"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="search" viewBox="0 0 24 24" aria-hidden="true"><path d="M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z"/></svg> </button> <dialog class="overlay search-dialog"> <form class="relative bg-white shadow-xl" action="/search">  <div class="search-input relative flex items-stretch"> <figure class="grid place-items-center"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="search" viewBox="0 0 24 24" aria-hidden="true"><path d="M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z"/></svg> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="loader" viewBox="0 0 24 24" aria-hidden="true"><path d="M18.364 5.63604L16.9497 7.05025C15.683 5.7835 13.933 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19C15.866 19 19 15.866 19 12H21C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C14.4853 3 16.7353 4.00736 18.364 5.63604Z"/></svg> </figure> <input type="text" name="q" value="" placeholder="Search for anything …" autocomplete="off" > <nav class="search-input-area grid relative place-items-center flex-shrink-0 text-sm leading-tight"> <button type="button" class="flex items-center"> <span class="block search-area" data-area="all">All pages</span> </button> <ul class="bg-black shadow-xl hidden"> <li><button class="search-area" type="button" data-area="all">All pages</button></li> <li><button class="search-area" type="button" data-area="guide">Guide</button></li> <li><button class="search-area" type="button" data-area="reference">Reference</button></li> <li><button class="search-area" type="button" data-area="cookbook">Cookbook</button></li> <li><button class="search-area" type="button" data-area="plugin">Plugin</button></li> <li><button class="search-area" type="button" data-area="kosmos">Kosmos</button></li> </ul> <input name="area" type="hidden" value="all"> </nav> </div>  <div class="search-results"> <ul></ul> <template> <li class="search-result"> <a class="leading-snug" href=""> <div> <h3 class="search-title font-bold text-sm"></h3> <div class="search-byline text-xs color-gray-700"></div> <div class="search-link text-xs font-mono color-gray-600"></div> </div> <div class="search-area" data-area=""></div> </a> </li> </template> </div>  <div class="search-footer flex flex-wrap items-center justify-between text-sm"> <div class="search-more flex-shrink-0"> <a class="hidden font-bold" href="/search"> View all <span class="search-more-count mx-1"></span> results &rsaquo; </a> </div> <a class="ml-auto color-gray-600" href="https://algolia.com"> Search by <?xml version="1.0"?> <svg role="img" aria-labelledby="f2140022-0326-40c5-bda2-fbbf0aa081b2" viewBox="0 0 2196.2 500"><title id="f2140022-0326-40c5-bda2-fbbf0aa081b2">Algolia</title> <title id="algolia-icon">Algolia</title> <rect width="62.58" height="277.9" x="1845.88" y="104.73" rx="5.9" ry="5.9"/> <path d="M1070.38 275.3V5.91c0-3.63-3.24-6.39-6.82-5.83l-50.46 7.94a5.91 5.91 0 0 0-4.99 5.84l.17 273.22c0 12.92 0 92.7 95.97 95.49 3.33.1 6.09-2.58 6.09-5.91v-40.78c0-2.96-2.19-5.51-5.12-5.84-34.85-4.01-34.85-47.57-34.85-54.72Zm781.4-203.92h50.77c3.26 0 5.9-2.64 5.9-5.9V5.9c0-3.62-3.24-6.39-6.82-5.83l-50.77 7.95a5.9 5.9 0 0 0-4.99 5.83v51.62c0 3.26 2.64 5.9 5.9 5.9Zm-87.75 203.92V5.91c0-3.63-3.24-6.39-6.82-5.83l-50.46 7.94a5.91 5.91 0 0 0-4.99 5.84l.17 273.22c0 12.92 0 92.7 95.97 95.49 3.33.1 6.09-2.58 6.09-5.91v-40.78c0-2.96-2.19-5.51-5.12-5.84-34.85-4.01-34.85-47.57-34.85-54.72Zm-132.08-132.58c-11.14-12.25-24.83-21.65-40.78-28.31-15.92-6.53-33.26-9.85-52.07-9.85-18.78 0-36.15 3.17-51.92 9.85-15.59 6.66-29.29 16.05-40.76 28.31-11.47 12.23-20.38 26.87-26.76 44.03-6.38 17.17-9.24 37.37-9.24 58.36s3.19 36.87 9.55 54.21c6.38 17.32 15.14 32.11 26.45 44.36 11.29 12.23 24.83 21.62 40.6 28.46 15.77 6.83 40.12 10.33 52.4 10.48 12.25 0 36.78-3.82 52.7-10.48 15.92-6.68 29.46-16.23 40.78-28.46 11.29-12.25 20.05-27.04 26.25-44.36 6.22-17.34 9.24-33.22 9.24-54.21s-3.34-41.19-10.03-58.36c-6.38-17.17-15.14-31.8-26.43-44.03Zm-44.43 163.75c-11.47 15.75-27.56 23.7-48.09 23.7-20.55 0-36.63-7.8-48.1-23.7-11.47-15.75-17.21-34.01-17.21-61.2 0-26.89 5.59-49.14 17.06-64.87 11.45-15.75 27.54-23.52 48.07-23.52 20.55 0 36.63 7.78 48.09 23.52 11.47 15.57 17.36 37.98 17.36 64.87 0 27.19-5.72 45.3-17.19 61.2Zm-693.1-201.74h-49.33c-48.36 0-90.91 25.48-115.75 64.1-14.52 22.58-22.99 49.63-22.99 78.73 0 44.89 20.13 84.92 51.59 111.1 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 1.23 0 2.46-.03 3.68-.09.36-.02.71-.05 1.07-.07.87-.05 1.75-.11 2.62-.2.34-.03.68-.08 1.02-.12.91-.1 1.82-.21 2.73-.34.21-.03.42-.07.63-.1 32.89-5.07 61.56-30.82 70.9-62.81v57.83c0 3.26 2.64 5.9 5.9 5.9h50.42c3.26 0 5.9-2.64 5.9-5.9V110.63c0-3.26-2.64-5.9-5.9-5.9zm0 206.92c-12.2 10.16-27.97 13.98-44.84 15.12-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-42.24 0-77.12-35.89-77.12-79.37 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33zm1239.55-206.92h-49.33c-48.36 0-90.91 25.48-115.75 64.1-14.52 22.58-22.99 49.63-22.99 78.73 0 44.89 20.13 84.92 51.59 111.1 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 1.23 0 2.46-.03 3.68-.09.36-.02.71-.05 1.07-.07.87-.05 1.75-.11 2.62-.2.34-.03.68-.08 1.02-.12.91-.1 1.82-.21 2.73-.34.21-.03.42-.07.63-.1 32.89-5.07 61.56-30.82 70.9-62.81v57.83c0 3.26 2.64 5.9 5.9 5.9h50.42c3.26 0 5.9-2.64 5.9-5.9V110.63c0-3.26-2.64-5.9-5.9-5.9zm0 206.92c-12.2 10.16-27.97 13.98-44.84 15.12-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-42.24 0-77.12-35.89-77.12-79.37 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33zm-819.92-206.92h-49.33c-48.36 0-90.91 25.48-115.75 64.1-11.79 18.34-19.6 39.64-22.11 62.59a148.5 148.5 0 0 0 .05 32.73c4.28 38.09 23.14 71.61 50.66 94.52 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 17.99 0 34.61-5.93 48.16-15.97 16.29-11.58 28.88-28.54 34.48-47.75v50.26h-.11v11.08c0 21.84-5.71 38.27-17.34 49.36-11.61 11.08-31.04 16.63-58.25 16.63-11.12 0-28.79-.59-46.6-2.41-2.83-.29-5.46 1.5-6.27 4.22l-12.78 43.11c-1.02 3.46 1.27 7.02 4.83 7.53 21.52 3.08 42.52 4.68 54.65 4.68 48.91 0 85.16-10.75 108.89-32.21 21.48-19.41 33.15-48.89 35.2-88.52V110.63c0-3.26-2.64-5.9-5.9-5.9h-56.32Zm0 64.1s.65 139.13 0 143.36c-12.08 9.77-27.11 13.59-43.49 14.7-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-1.32 0-2.63-.03-3.94-.1-40.41-2.11-74.52-37.26-74.52-79.38 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33ZM249.83 0C113.3 0 2 110.09.03 246.16c-2 138.19 110.12 252.7 248.33 253.5 42.68.25 83.79-10.19 120.3-30.03 3.56-1.93 4.11-6.83 1.08-9.51l-23.38-20.72c-4.75-4.21-11.51-5.4-17.36-2.92-25.48 10.84-53.17 16.38-81.71 16.03-111.68-1.37-201.91-94.29-200.13-205.96 1.76-110.26 92-199.41 202.67-199.41h202.69v360.27l-115-102.18c-3.72-3.31-9.42-2.66-12.42 1.31-18.46 24.44-48.53 39.64-81.93 37.34-46.33-3.2-83.87-40.5-87.34-86.81-4.15-55.24 39.63-101.52 94-101.52 49.18 0 89.68 37.85 93.91 85.95.38 4.28 2.31 8.27 5.52 11.12l29.95 26.55c3.4 3.01 8.79 1.17 9.63-3.3 2.16-11.55 2.92-23.58 2.07-35.92-4.82-70.34-61.8-126.93-132.17-131.26-80.68-4.97-148.13 58.14-150.27 137.25-2.09 77.1 61.08 143.56 138.19 145.26 32.19.71 62.03-9.41 86.14-26.95l150.26 133.2c6.44 5.71 16.61 1.14 16.61-7.47V9.48c-.01-5.23-4.25-9.48-9.49-9.48z"/> </svg> </a> </div> </form> </dialog> </div> </div> </div> </header> <main id="main" class="main"> <div class="container"> <article> <header class="mb-36"> <div class="columns" style="--columns-md: 1; --columns: 2; --column-gap: var(--spacing-24)"> <div> <h1 class="h1 max-w-xl mb-6">Staying out of your way: Kirby provides timeless simplicity in design and code</h1> <span aria-hidden="true" class="h1 font-thin">↓</span> </div> <div class="pt-3"> <p class="h6 mb-3">For designers</p> <p class="sr-only">Features:</p> <ul class="features-checklist"> <li> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="check" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z"/></svg> Design without compromises </li> <li> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="check" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z"/></svg> Clear separation between design and content </li> <li> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="check" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z"/></svg> A fully customizable admin interface </li> <li> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="check" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z"/></svg> White-labeled from the start </li> <li> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="check" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z"/></svg> A fantastic prototyping companion </li> </ul> </div> </div> </header> <section id="your-workflow" class="features-section"> <header class="features-section-header max-w-xl"> <h2 class="h2">Your vision, your workflow</h2> <p class="h2 color-gray-600">No compromises</p> </header> <div class="features-section-text prose leading-snug text-lg"> <p>Kirby is a system that gets out of your way. There are no excuses why a design direction should not be executable with Kirby.</p> </div> <div class="features-section-figure"> <style> .workflow li { height: 6rem; } @media screen and (max-width: 40rem) { .workflow { margin-left: calc(-1 * var(--container-padding) + .75rem); margin-right: 2rem; } .workflow li svg { width: 3rem; height: 3rem; } } .workflow figure { position: relative; display: inline-flex; } .workflow figcaption { position: absolute; top: 100%; margin-top: -.75rem; margin-left: -.75rem; left: 100%; } .workflow svg { width: 64px; height: 64px; } .workflow svg * { stroke: var(--color-gray-300); } </style> <ul class="workflow"> <li style="margin-left: 20%"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><path fill="none" stroke="#111111" stroke-miterlimit="10" d="M54,24 c0-12.15-9.85-22-22-22s-22,9.85-22,22c0,8.545,4.882,15.936,12,19.579V55h20V43.579C49.118,39.936,54,32.545,54,24z"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="22" y1="61" x2="42" y2="61"/> <polyline data-color="color-2" fill="none" stroke-miterlimit="10" points=" 19,27 26,34 32,28 38,34 45,27 "/></g></svg> <figcaption class="badge" style="color: var(--color-purple-500)">Idea</figaption> </figure> </li> <li style="margin-left: 60%"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><polyline data-cap="butt" points="39 61 39 44 56 44" fill="none" stroke="#111111" stroke-miterlimit="10" stroke-linecap="butt"/><polygon points="39 61 8 61 8 3 56 3 56 44 39 61" fill="none" stroke="#111111" stroke-miterlimit="10"/></g></svg> <figcaption class="badge" style="color: var(--color-blue-500)">Concept</figaption> </figure> </li> <li style="margin-left: 0%; margin-top: -6rem"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><rect x="4" y="44" width="8" height="13" fill="none" stroke="#111111" stroke-miterlimit="10"/><rect x="36" y="43" width="8" height="14" fill="none" stroke="#111111" stroke-miterlimit="10"/><rect x="20" y="27" width="8" height="30" fill="none" stroke="#111111" stroke-miterlimit="10"/><rect x="52" y="27" width="8" height="30" fill="none" stroke="#111111" stroke-miterlimit="10"/><circle cx="8" cy="27" r="4" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/><circle cx="40" cy="27" r="4" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/><circle cx="24" cy="11" r="4" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/><circle cx="56" cy="11" r="4" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/><line x1="10.828" y1="24.172" x2="21.172" y2="13.828" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/><line x1="37.172" y1="24.172" x2="26.828" y2="13.828" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/><line x1="42.828" y1="24.172" x2="53.172" y2="13.828" fill="none" stroke-miterlimit="10" data-cap="butt" data-color="color-2" stroke-linecap="butt"/></g></svg> <figcaption class="badge" style="color: var(--color-green-500)">Research</figaption> </figure> </li> <li style="margin-left: 40%"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><rect data-color="color-2" x="10" y="31" fill="none" stroke-miterlimit="10" width="16" height="16"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="33" y1="31" x2="54" y2="31"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="33" y1="39" x2="54" y2="39"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="33" y1="47" x2="45" y2="47"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="13" x2="14" y2="13"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="20" y1="13" x2="24" y2="13"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="43" y1="13" x2="54" y2="13"/> <line fill="none" stroke="#111111" stroke-miterlimit="10" x1="2" y1="20" x2="62" y2="20"/> <rect x="2" y="6" fill="none" stroke="#111111" stroke-miterlimit="10" width="60" height="52"/></g></svg> <figcaption class="badge" style="color: var(--color-red-500)">Prototyping</figaption> </figure> </li> <li style="margin-left: 80%"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><path data-color="color-2" d="M14,59a100.553,100.553,0,0,1,18-2,100.553,100.553,0,0,1,18,2" fill="none" stroke-miterlimit="10"/><line data-color="color-2" x1="32" y1="49" x2="32" y2="57" fill="none" stroke-miterlimit="10"/><rect x="2" y="5" width="60" height="44" fill="none" stroke="#111111" stroke-miterlimit="10"/><line x1="2" y1="40" x2="62" y2="40" fill="none" stroke="#111111" stroke-miterlimit="10"/></g></svg> <figcaption class="badge" style="color: var(--color-aqua-500)">Design</figaption> </figure> </li> <li style="margin-left: 20%; margin-top: -6rem"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="27" x2="16" y2="27"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="39" x2="14" y2="39"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="33" x2="12" y2="33"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="45" x2="12" y2="45"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="51" x2="16" y2="51"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="32" y1="27" x2="37" y2="27"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="36" y1="33" x2="44" y2="33"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="40" y1="39" x2="54" y2="39"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="36" y1="45" x2="44" y2="45"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="32" y1="51" x2="37" y2="51"/> <line fill="none" stroke="#111111" stroke-miterlimit="10" x1="24" y1="20" x2="24" y2="58"/> <line data-color="color-2" fill="none" stroke-miterlimit="10" x1="10" y1="13" x2="14" y2="13"/> <line fill="none" stroke="#111111" stroke-miterlimit="10" x1="2" y1="20" x2="62" y2="20"/> <rect x="2" y="6" fill="none" stroke="#111111" stroke-miterlimit="10" width="60" height="52"/></g></svg> <figcaption class="badge" style="color: var(--color-orange-500)">Development</figaption> </figure> </li> <li style="margin-left: 60%"> <figure> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g class="nc-icon-wrapper" stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="#111111" stroke="#111111"><line data-cap="butt" data-color="color-2" fill="none" stroke-miterlimit="10" x1="29" y1="29" x2="35" y2="35" stroke-linecap="butt"/> <polygon data-color="color-2" fill="none" stroke-miterlimit="10" points=" 46,18 29,29 18,46 35,35 "/> <circle fill="none" stroke="#111111" stroke-miterlimit="10" cx="32" cy="32" r="30"/></g></svg> <figcaption class="badge" style="color: var(--color-yellow-300)">Shipping</figaption> </figure> </li> </ul> </div> <div class="features-section-grid"> <ul class="columns" style="--columns: 2; --column-gap: var(--spacing-12)"> <li class="text-sm"> <h3 class="font-bold"> Your tools of choice </h3> <p class="color-gray-800"> Kirby embraces your tools of choice and your workflow. No matter if you work in Figma, design your sites in Webflow or create prototypes in the browser – bring the final result into Kirby and connect it with your content.</p> </li> <li class="text-sm"> <h3 class="font-bold"> No CMS smell </h3> <p class="color-gray-800"> Kirby makes no assumptions about the way you design your site, nor does it impose anything on you. No frameworks, no widgets… Each Kirby site is 100% yours.</p> </li> <li class="text-sm"> <h3 class="font-bold"> A philosophy of minimalism </h3> <p class="color-gray-800"> Our philosophy at Kirby is to start as lean as possible and to create a powerful set of building blocks for you. With Kirby you add the things you need in a project instead of having to remove tons of unwanted features and plugins to get started.</p> </li> <li class="text-sm"> <h3 class="font-bold"> An interface without branding </h3> <p class="color-gray-800"> The Panel, Kirby's admin backend, comes with a very timeless design without Kirby branding – at no extra cost. And your site frontend is fully yours as well, so you get a white-label solution without having to modify the sources.</p> </li> </ul> </div> <div class="features-section-voice"> <blockquote class="voice"> <p class="mb-3 text-lg leading-snug"> I've been kicking the tires on Kirby as I revamp my site and it's been... outstanding✨ Feels and acts like a lightweight CMS, relatively easy to customize, and (so far) pretty adaptable for the modifications I've thrown at it. </p> <footer> <a href="http://cameronmoll.com/"> <figure class="flex items-center"> <div class="flex-shrink-0 mr-3" style="width: var(--spacing-12); --aspect-ratio: 1/1"> <img alt="Photo of Cameron Moll" height="48" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/voices/cameron-moll/4cbe7e2a92-1717846668/cameron-moll.jpg?width=48&height=48&crop=fp%2C0.5%2C0.5" srcset="https://assets.getkirby.com/media/pages/voices/cameron-moll/4cbe7e2a92-1717846668/cameron-moll.jpg?width=48&height=48&crop=fp%2C0.5%2C0.5 48w, https://assets.getkirby.com/media/pages/voices/cameron-moll/4cbe7e2a92-1717846668/cameron-moll.jpg?width=96&height=96&crop=fp%2C0.5%2C0.5 96w" width="48"> </div> <figcaption class="text-sm"> <p><strong>Cameron Moll</strong></p> <p class="font-mono text-xs color-gray-700">VP design/research</p> </figcaption> </figure> </a> </footer> </blockquote> </div> </section> <section id="interface" class="features-section features-section--reverse"> <header class="features-section-header max-w-xl"> <h2 class="h2">Be the interface designer</h2> <p class="h2 color-gray-600">Modern publishing possibilities at your fingertips</p> </header> <div class="features-section-text prose leading-snug text-lg"> <p>You can customize our admin panel to the very last bit, and put as much care into the editing experience as you put into the design of the frontend. Combine interface elements and features in a way that reflects your design intentions and content requirements in the best possible way.</p> </div> <div class="features-section-figure"> <style> .ingrid { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: repeat(4, min-content); grid-gap: clamp(var(--spacing-2px), 1.5vw, var(--spacing-6)); } .ingrid img { background: var(--color-light); border-radius: var(--rounded); overflow: hidden; } </style> <div class="ingrid"> <div style="grid-column: span 6; align-self: flex-end"> <a class="block" data-lightbox="interface" href="https://assets.getkirby.com/media/pages/for/designers/07b4e03841-1723458007/author.png?width=838&height=432&enlarge=0" style="--aspect-ratio: 276/142"><img alt="A screenshot of the users and tags fields" height="142" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/for/designers/07b4e03841-1723458007/author.png?width=276&height=142&enlarge=0" srcset="https://assets.getkirby.com/media/pages/for/designers/07b4e03841-1723458007/author.png?width=276&height=142&enlarge=0 276w, https://assets.getkirby.com/media/pages/for/designers/07b4e03841-1723458007/author.png?width=400&height=206&enlarge=0 400w, https://assets.getkirby.com/media/pages/for/designers/07b4e03841-1723458007/author.png?width=552&height=285&enlarge=0 552w, https://assets.getkirby.com/media/pages/for/designers/07b4e03841-1723458007/author.png?width=800&height=412&enlarge=0 800w" width="276"></a> </div> <div style="grid-column: span 6; align-self: flex-end"> <a class="block" data-lightbox="interface" href="https://assets.getkirby.com/media/pages/for/designers/2f46f47f3c-1723458007/list.png?width=834&height=244&enlarge=0" style="--aspect-ratio: 276/81"><img alt="A screenshot with a list of pages" height="81" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/for/designers/2f46f47f3c-1723458007/list.png?width=276&height=81&enlarge=0" srcset="https://assets.getkirby.com/media/pages/for/designers/2f46f47f3c-1723458007/list.png?width=276&height=81&enlarge=0 276w, https://assets.getkirby.com/media/pages/for/designers/2f46f47f3c-1723458007/list.png?width=400&height=117&enlarge=0 400w, https://assets.getkirby.com/media/pages/for/designers/2f46f47f3c-1723458007/list.png?width=552&height=161&enlarge=0 552w, https://assets.getkirby.com/media/pages/for/designers/2f46f47f3c-1723458007/list.png?width=800&height=234&enlarge=0 800w" width="276"></a> </div> <div style="grid-column: span 12"> <a class="block" data-lightbox="interface" href="https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=1800&height=806&enlarge=0" style="--aspect-ratio: 576/258"><img alt="A screenshot of our layout field" height="258" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=576&height=258&enlarge=0" srcset="https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=576&height=258&enlarge=0 576w, https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=800&height=358&enlarge=0 800w, https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=1152&height=516&enlarge=0 1152w, https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=1600&height=716&enlarge=0 1600w, https://assets.getkirby.com/media/pages/for/designers/688cd9013d-1723458007/images.png?width=2000&height=895&enlarge=0 2000w" width="576"></a> </div> <div style="grid-column: span 9"> <a class="block" data-lightbox="interface" href="https://assets.getkirby.com/media/pages/for/designers/a8d31f6e39-1723458007/structure.png?width=1440&height=388&enlarge=0" style="--aspect-ratio: 426/115"><img alt="A screenshot of our structure field to edit tabular data" height="115" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/for/designers/a8d31f6e39-1723458007/structure.png?width=426&height=115&enlarge=0" srcset="https://assets.getkirby.com/media/pages/for/designers/a8d31f6e39-1723458007/structure.png?width=426&height=115&enlarge=0 426w, https://assets.getkirby.com/media/pages/for/designers/a8d31f6e39-1723458007/structure.png?width=852&height=230&enlarge=0 852w" width="426"></a> </div> <div style="grid-column: span 7"> <a class="block" data-lightbox="interface" href="https://assets.getkirby.com/media/pages/for/designers/a5f9039dcc-1723458007/albums.png?width=916&height=574&enlarge=0" style="--aspect-ratio: 326/204"><img alt="A screenshot of an gallery section in the Panel." height="204" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/for/designers/a5f9039dcc-1723458007/albums.png?width=326&height=204&enlarge=0" srcset="https://assets.getkirby.com/media/pages/for/designers/a5f9039dcc-1723458007/albums.png?width=326&height=204&enlarge=0 326w, https://assets.getkirby.com/media/pages/for/designers/a5f9039dcc-1723458007/albums.png?width=652&height=409&enlarge=0 652w" width="326"></a> </div> </div> </div> <div class="features-section-grid"> <ul class="columns" style="--columns: 2; --column-gap: var(--spacing-12)"> <li class="text-sm"> <h3 class="font-bold"> Easy custom fields </h3> <p class="color-gray-800"> Structured data is the key to successful interface design. With Kirby, custom fields are extremely easy to implement. Break down content into atoms and integrate them into your design.</p> </li> <li class="text-sm"> <h3 class="font-bold"> Content control </h3> <p class="color-gray-800"> Build healthy content constraints into the interface. Required fields and extensive input validation features make sure that your content will never break your layouts.</p> </li> <li class="text-sm"> <h3 class="font-bold"> Perfect previews </h3> <p class="color-gray-800"> The age of boring tables is long gone. Let your content shine in the admin interface. Use rich image previews and icons for various content types and make your editors feel at home.</p> </li> <li class="text-sm"> <h3 class="font-bold"> Reliable assets </h3> <p class="color-gray-800"> Galleries, covers, embedded videos, download lists – avoid unwanted surprises for such features and fine-tune upload restrictions. Optimize final image sizes with our built-in image processing API. </p> </li> </ul> </div> <div class="features-section-voice"> <blockquote class="voice"> <p class="mb-3 text-lg leading-snug"> Fast. Well documented. Best support. With Kirby a basic site setup is done within 5 minutes. Brilliant. </p> <footer> <a href="https://beyondtellerrand.com"> <figure class="flex items-center"> <div class="flex-shrink-0 mr-3" style="width: var(--spacing-12); --aspect-ratio: 1/1"> <img alt="Photo of Marc Thiele" height="48" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/voices/marc-thiele/ce3e48f3f6-1717846668/marcthiele.jpg?width=48&height=48&crop=fp%2C0.5%2C0.5" srcset="https://assets.getkirby.com/media/pages/voices/marc-thiele/ce3e48f3f6-1717846668/marcthiele.jpg?width=48&height=48&crop=fp%2C0.5%2C0.5 48w, https://assets.getkirby.com/media/pages/voices/marc-thiele/ce3e48f3f6-1717846668/marcthiele.jpg?width=96&height=96&crop=fp%2C0.5%2C0.5 96w" width="48"> </div> <figcaption class="text-sm"> <p><strong>Marc Thiele</strong></p> <p class="font-mono text-xs color-gray-700">Organizer of @btconf</p> </figcaption> </figure> </a> </footer> </blockquote> </div> </section> <section id="prototyping" class="features-section"> <header class="features-section-header max-w-xl"> <h2 class="h2">A new way of prototyping</h2> <p class="h2 color-gray-600">Files & folders</p> </header> <div class="features-section-text prose leading-snug text-lg"> <p>Kirby’s file-based system is the perfect prototyping tool. Take your Finder or Windows Explorer and get going.</p> </div> <div class="features-section-figure"> <figure> <a class="block" data-lightbox href="https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=1572&height=1656&enlarge=0" style="--aspect-ratio: 576/607"><img alt="A screenshot of the file system with folders, text files and images in Kirby’s content folder" height="607" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=576&height=607&enlarge=0" srcset="https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=300&height=316&enlarge=0 300w, https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=576&height=607&enlarge=0 576w, https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=750&height=790&enlarge=0 750w, https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=900&height=948&enlarge=0 900w, https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=1152&height=1214&enlarge=0 1152w, https://assets.getkirby.com/media/pages/for/designers/f5ab6d0b4b-1723458007/files-and-folders.png?width=1500&height=1580&enlarge=0 1500w" width="576"></a></figure> </div> <div class="features-section-grid"> <ul class="columns" style="--columns: 2; --column-gap: var(--spacing-12)"> <li class="text-sm"> <h3 class="font-bold"> Content architecture at light-speed </h3> <p class="color-gray-800"> Create entire page hierarchies in a matter of minutes. Add folders and subfolders, toss in images, videos and documents and start exploring ideas together with your clients.</p> </li> <li class="text-sm"> <h3 class="font-bold"> A text editor is all you need </h3> <p class="color-gray-800"> Kirby stores your content in super simple text files. Open them in any text editor. Add new fields, change content and dive deep into your projects without a complicated setup process.</p> </li> </ul> </div> <div class="features-section-voice"> <blockquote class="voice"> <p class="mb-3 text-lg leading-snug"> My whole site is on Kirby except for my store—highly recommend! So great for organizing projects because it’s all just folders of images and text docs. </p> <footer> <a href="https://www.jessicahische.is/awesome"> <figure class="flex items-center"> <div class="flex-shrink-0 mr-3" style="width: var(--spacing-12); --aspect-ratio: 1/1"> <img alt="Photo of Jessica Hische" height="48" loading="lazy" sizes="auto" src="https://assets.getkirby.com/media/pages/voices/jessicahische/6dd3b7c245-1717846668/jessica-hische.jpg?width=48&height=48&crop=fp%2C0.5%2C0.5" srcset="https://assets.getkirby.com/media/pages/voices/jessicahische/6dd3b7c245-1717846668/jessica-hische.jpg?width=48&height=48&crop=fp%2C0.5%2C0.5 48w, https://assets.getkirby.com/media/pages/voices/jessicahische/6dd3b7c245-1717846668/jessica-hische.jpg?width=96&height=96&crop=fp%2C0.5%2C0.5 96w" width="48"> </div> <figcaption class="text-sm"> <p><strong>Jessica Hische</strong></p> <p class="font-mono text-xs color-gray-700">Lettering artist & author</p> </figcaption> </figure> </a> </footer> </blockquote> </div> </section> <style> .features-more svg { width: 32px; height: 32px; fill: var(--color-black); } </style> <section id="more" class="features-more mb-24"> <header class="max-w-xl mb-6"> <h2 class="h2">And so much more</h2> <p class="h2 color-gray-600">Kirby is packed with features that empower you to build amazing sites.</p> </header> <ul class="columns auto-rows-fr" style="--columns-sm: 2; --columns-md: 2; --columns-lg: 5; --gap: var(--spacing-1)"> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/for/creators#panel"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"><path d="M4 21C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4ZM8 10H5V19H8V10ZM19 10H10V19H19V10ZM19 5H5V8H19V5Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">The Panel</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/for/creators#editing"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 13C14.7614 13 17 15.2386 17 18C17 20.7614 14.7614 23 12 23C9.23858 23 7 20.7614 7 18C7 15.2386 9.23858 13 12 13ZM13 15H11V16.999L9 17V19L11 18.999V21H13V18.999L15 19V17L13 16.999V15ZM20 3C20.5523 3 21 3.44772 21 4V10C21 10.5523 20.5523 11 20 11H4C3.44772 11 3 10.5523 3 10V4C3 3.44772 3.44772 3 4 3H20ZM5 5V9H19V5H5Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Blocks field</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/for/developers#plugins"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="box" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 1L21.5 6.5V17.5L12 23L2.5 17.5V6.5L12 1ZM5.49388 7.0777L12.0001 10.8444L18.5062 7.07774L12 3.311L5.49388 7.0777ZM4.5 8.81329V16.3469L11.0001 20.1101V12.5765L4.5 8.81329ZM13.0001 20.11L19.5 16.3469V8.81337L13.0001 12.5765V20.11Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Plugins</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/for/creators#internationalisation"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="translate" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 15V17C5 18.0544 5.81588 18.9182 6.85074 18.9945L7 19H10V21H7C4.79086 21 3 19.2091 3 17V15H5ZM18 10L22.4 21H20.245L19.044 18H14.954L13.755 21H11.601L16 10H18ZM17 12.8852L15.753 16H18.245L17 12.8852ZM8 2V4H12V11H8V14H6V11H2V4H6V2H8ZM17 3C19.2091 3 21 4.79086 21 7V9H19V7C19 5.89543 18.1046 5 17 5H14V3H17ZM6 6H4V9H6V6ZM10 6H8V9H10V6Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Languages</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/docs/guide/users"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="users" viewBox="0 0 24 24" aria-hidden="true"><path d="M2 22C2 17.5817 5.58172 14 10 14C14.4183 14 18 17.5817 18 22H16C16 18.6863 13.3137 16 10 16C6.68629 16 4 18.6863 4 22H2ZM10 13C6.685 13 4 10.315 4 7C4 3.685 6.685 1 10 1C13.315 1 16 3.685 16 7C16 10.315 13.315 13 10 13ZM10 11C12.21 11 14 9.21 14 7C14 4.79 12.21 3 10 3C7.79 3 6 4.79 6 7C6 9.21 7.79 11 10 11ZM18.2837 14.7028C21.0644 15.9561 23 18.752 23 22H21C21 19.564 19.5483 17.4671 17.4628 16.5271L18.2837 14.7028ZM17.5962 3.41321C19.5944 4.23703 21 6.20361 21 8.5C21 11.3702 18.8042 13.7252 16 13.9776V11.9646C17.6967 11.7222 19 10.264 19 8.5C19 7.11935 18.2016 5.92603 17.041 5.35635L17.5962 3.41321Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Users</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/for/creators#assets"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="url" viewBox="0 0 24 24" aria-hidden="true"><path d="M18.3643 15.5353L16.95 14.1211L18.3643 12.7069C20.3169 10.7543 20.3169 7.58847 18.3643 5.63585C16.4116 3.68323 13.2458 3.68323 11.2932 5.63585L9.87898 7.05007L8.46477 5.63585L9.87898 4.22164C12.6127 1.48797 17.0448 1.48797 19.7785 4.22164C22.5121 6.95531 22.5121 11.3875 19.7785 14.1211L18.3643 15.5353ZM15.5358 18.3638L14.1216 19.778C11.388 22.5117 6.9558 22.5117 4.22213 19.778C1.48846 17.0443 1.48846 12.6122 4.22213 9.87849L5.63634 8.46428L7.05055 9.87849L5.63634 11.2927C3.68372 13.2453 3.68372 16.4112 5.63634 18.3638C7.58896 20.3164 10.7548 20.3164 12.7074 18.3638L14.1216 16.9496L15.5358 18.3638ZM14.8287 7.75717L16.2429 9.17139L9.17187 16.2425L7.75766 14.8282L14.8287 7.75717Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Assets</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/for/developers#templating"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="dashboard" viewBox="0 0 24 24" aria-hidden="true"><path d="M22 20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21C21.5523 3 22 3.44772 22 4V20ZM11 15H4V19H11V15ZM20 11H13V19H20V11ZM11 5H4V13H11V5ZM20 5H13V9H20V5Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Templating</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/docs/guide/content/publishing-workflow"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"><path d="M14.5998 8.00033H21C22.1046 8.00033 23 8.89576 23 10.0003V12.1047C23 12.3659 22.9488 12.6246 22.8494 12.8662L19.755 20.3811C19.6007 20.7558 19.2355 21.0003 18.8303 21.0003H2C1.44772 21.0003 1 20.5526 1 20.0003V10.0003C1 9.44804 1.44772 9.00033 2 9.00033H5.48184C5.80677 9.00033 6.11143 8.84246 6.29881 8.57701L11.7522 0.851355C11.8947 0.649486 12.1633 0.581978 12.3843 0.692483L14.1984 1.59951C15.25 2.12534 15.7931 3.31292 15.5031 4.45235L14.5998 8.00033ZM7 10.5878V19.0003H18.1606L21 12.1047V10.0003H14.5998C13.2951 10.0003 12.3398 8.77128 12.6616 7.50691L13.5649 3.95894C13.6229 3.73105 13.5143 3.49353 13.3039 3.38837L12.6428 3.0578L7.93275 9.73038C7.68285 10.0844 7.36341 10.3746 7 10.5878ZM5 11.0003H3V19.0003H5V11.0003Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Publishing</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/docs/cookbook"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="bookmark" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 2H19C19.5523 2 20 2.44772 20 3V22.1433C20 22.4194 19.7761 22.6434 19.5 22.6434C19.4061 22.6434 19.314 22.6168 19.2344 22.5669L12 18.0313L4.76559 22.5669C4.53163 22.7136 4.22306 22.6429 4.07637 22.4089C4.02647 22.3293 4 22.2373 4 22.1433V3C4 2.44772 4.44772 2 5 2ZM18 4H6V19.4324L12 15.6707L18 19.4324V4Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Cookbook</figcaption> </figure> </a> </li> <li class="bg-white overflow-hidden rounded"> <a class="block py-6 color-gray-700" href="/docs"> <figure class="flex items-center flex-column justify-center"> <span class="mb-3"><?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="book" viewBox="0 0 24 24" aria-hidden="true"><path d="M13 21V23H11V21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H9C10.1947 3 11.2671 3.52375 12 4.35418C12.7329 3.52375 13.8053 3 15 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H13ZM20 19V5H15C13.8954 5 13 5.89543 13 7V19H20ZM11 19V7C11 5.89543 10.1046 5 9 5H4V19H11Z"/></svg> </span> <figcaption class="font-mono text-xs truncate">Extensive docs</figcaption> </figure> </a> </li> </ul> </section> <section id="get-started" class="mb-42"> <h2 class="h2 text-center mb-6">What are you waiting for?</h2> <nav class="cta auto-fit items-center mb-0 mx-auto" style="--min: 9rem; --gap: var(--spacing-3); max-width: 24rem"> <a class="btn btn--filled" href="https://getkirby.com/try"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="download" viewBox="0 0 24 24" aria-hidden="true"><path d="M13 10H18L12 16L6 10H11V3H13V10ZM4 19H20V12H22V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V12H4V19Z"/></svg> Try now </a> <a class="btn btn--outlined" href="https://getkirby.com/docs/guide/quickstart"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="book" viewBox="0 0 24 24" aria-hidden="true"><path d="M13 21V23H11V21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H9C10.1947 3 11.2671 3.52375 12 4.35418C12.7329 3.52375 13.8053 3 15 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H13ZM20 19V5H15C13.8954 5 13 5.89543 13 7V19H20ZM11 19V7C11 5.89543 10.1046 5 9 5H4V19H11Z"/></svg> Docs </a> </nav> </section> <section id="for"> <div class="columns auto-rows-fr" style="--columns-md: 2; --columns: 3; --gap: var(--spacing-12)"> <a class="block border-top pt-3" href="https://getkirby.com/for/developers"> <article> <h3 class="h2 mb-3"> <span class="mr-1">Developers</span> <span aria-hidden="true" class="font-thin">→</span> </h3> <p class="color-gray-700">A powerful platform: Kirby is built with flexibility and extensibility in mind</p> </article> </a> <a class="block border-top pt-3" href="https://getkirby.com/for/creators"> <article> <h3 class="h2 mb-3"> <span class="mr-1">Creators</span> <span aria-hidden="true" class="font-thin">→</span> </h3> <p class="color-gray-700">Perfect for content curation: Kirby makes you feel at home without endless workshops</p> </article> </a> <a class="block border-top pt-3" href="https://getkirby.com/for/clients"> <article> <h3 class="h2 mb-3"> <span class="mr-1">Clients</span> <span aria-hidden="true" class="font-thin">→</span> </h3> <p class="color-gray-700">From specialized to high-traffic: Kirby scales to match the popularity of any project</p> </article> </a> </div> </section> </article> </div> </main> <footer class="footer text-sm"> <div class="container mb-24"> <hr class="hr mb-6"> <div class="flex"> <div class="footer-info mb-6"> <p class="font-bold mb-1">Kirby</p> <p class="mb-3">The CMS that adapts to any project. Made for developers, designers, creators and clients.</p> <nav aria-label="Kirby on the web" class="social mb-3"> <a rel="me" href="https://github.com/getkirby"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="github" viewBox="0 0 24 24" role="img" aria-labelledby="d28c77a2-39be-40fb-83e2-6e0835daff09"><title id="d28c77a2-39be-40fb-83e2-6e0835daff09">GitHub</title><path d="M12.001 2C6.47598 2 2.00098 6.475 2.00098 12C2.00098 16.425 4.86348 20.1625 8.83848 21.4875C9.33848 21.575 9.52598 21.275 9.52598 21.0125C9.52598 20.775 9.51348 19.9875 9.51348 19.15C7.00098 19.6125 6.35098 18.5375 6.15098 17.975C6.03848 17.6875 5.55098 16.8 5.12598 16.5625C4.77598 16.375 4.27598 15.9125 5.11348 15.9C5.90098 15.8875 6.46348 16.625 6.65098 16.925C7.55098 18.4375 8.98848 18.0125 9.56348 17.75C9.65098 17.1 9.91348 16.6625 10.201 16.4125C7.97598 16.1625 5.65098 15.3 5.65098 11.475C5.65098 10.3875 6.03848 9.4875 6.67598 8.7875C6.57598 8.5375 6.22598 7.5125 6.77598 6.1375C6.77598 6.1375 7.61348 5.875 9.52598 7.1625C10.326 6.9375 11.176 6.825 12.026 6.825C12.876 6.825 13.726 6.9375 14.526 7.1625C16.4385 5.8625 17.276 6.1375 17.276 6.1375C17.826 7.5125 17.476 8.5375 17.376 8.7875C18.0135 9.4875 18.401 10.375 18.401 11.475C18.401 15.3125 16.0635 16.1625 13.8385 16.4125C14.201 16.725 14.5135 17.325 14.5135 18.2625C14.5135 19.6 14.501 20.675 14.501 21.0125C14.501 21.275 14.6885 21.5875 15.1885 21.4875C19.259 20.1133 21.9999 16.2963 22.001 12C22.001 6.475 17.526 2 12.001 2Z"/></svg> </a> <a rel="me" href="https://mastodon.social/@getkirby"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="mastodon" viewBox="0 0 24 24" role="img" aria-labelledby="5da2c6d0-80ac-421d-9415-69da7b4851c7"><title id="5da2c6d0-80ac-421d-9415-69da7b4851c7">Mastodon</title><path d="M 20.380566 6.98424 C 20.119244 5.050461 18.421263 3.526289 16.408482 3.230936 C 16.068155 3.181103 14.78221 3 11.801931 3 L 11.778838 3 C 8.797343 3 8.158018 3.179888 7.818907 3.230936 C 5.862036 3.517782 4.075327 4.887592 3.641412 6.844463 C 3.432355 7.808313 3.410477 8.876694 3.449371 9.856344 C 3.504066 11.262618 3.515005 12.665245 3.643843 14.065441 C 3.73257 14.995259 3.886932 15.917785 4.108144 16.824509 C 4.520181 18.501827 6.187776 19.899593 7.822554 20.468424 C 9.5728 21.061562 11.454313 21.161228 13.258039 20.752838 C 13.456157 20.706652 13.653059 20.654387 13.846316 20.593615 C 14.283877 20.455053 14.798012 20.300692 15.1748 20.028431 C 15.1855 20.020786 15.192194 20.008738 15.193032 19.995613 L 15.193032 18.639174 C 15.19266 18.627041 15.186813 18.61573 15.177132 18.60841 C 15.16745 18.601089 15.154973 18.598545 15.143199 18.601494 C 13.987307 18.874971 12.80346 19.012318 11.615968 19.009886 C 9.571584 19.009886 9.022202 18.047249 8.864193 17.646152 C 8.738102 17.299969 8.658008 16.938732 8.625965 16.571695 C 8.625173 16.559242 8.630404 16.547165 8.640029 16.539223 C 8.649655 16.531281 8.662507 16.528442 8.674582 16.531586 C 9.811028 16.803846 10.975427 16.941193 12.144688 16.939978 C 12.425456 16.939978 12.705009 16.939978 12.986993 16.932684 C 14.162332 16.899868 15.400873 16.840309 16.557981 16.616667 L 16.639416 16.598436 C 18.463804 16.250818 20.20068 15.159346 20.376919 12.395416 C 20.382996 12.286025 20.398798 11.255324 20.398798 11.143504 C 20.400013 10.759422 20.523989 8.4209 20.380566 6.98424 Z M 17.57288 13.880693 L 15.654902 13.880693 L 15.654902 9.217018 C 15.654902 8.234937 15.242866 7.734171 14.405422 7.734171 C 13.484112 7.734171 13.022242 8.327311 13.022242 9.496572 L 13.022242 12.049013 L 11.115204 12.049013 L 11.115204 9.496572 C 11.115204 8.327311 10.653333 7.734171 9.732023 7.734171 C 8.898226 7.734171 8.481327 8.234937 8.480111 9.217018 L 8.480111 13.880693 L 6.56578 13.880693 L 6.56578 9.076027 C 6.56578 8.093944 6.818594 7.313625 7.323004 6.735073 C 7.844432 6.158951 8.527514 5.862381 9.375896 5.862381 C 10.357979 5.862381 11.099402 6.236738 11.59409 6.985455 L 12.071761 7.781574 L 12.549432 6.985455 C 13.044119 6.236738 13.785543 5.862381 14.765194 5.862381 C 15.613577 5.862381 16.296659 6.158951 16.819302 6.735073 C 17.323713 7.31241 17.576527 8.092729 17.576527 9.076027 L 17.574095 13.880693 Z"/></svg> </a> <a rel="me" href="https://bsky.app/profile/getkirby.com"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" role="img" aria-labelledby="c9db0043-ecb3-4594-baee-b16e51da8b3f"><title id="c9db0043-ecb3-4594-baee-b16e51da8b3f">Bluesky</title><path d="M12 11.3884C11.0942 9.62673 8.62833 6.34423 6.335 4.7259C4.13833 3.17506 3.30083 3.4434 2.75167 3.69256C2.11583 3.9784 2 4.95506 2 5.52839C2 6.10339 2.315 10.2367 2.52 10.9276C3.19917 13.2076 5.61417 13.9776 7.83917 13.7309C4.57917 14.2142 1.68333 15.4017 5.48083 19.6292C9.65833 23.9542 11.2058 18.7017 12 16.0392C12.7942 18.7017 13.7083 23.7651 18.4442 19.6292C22 16.0392 19.4208 14.2142 16.1608 13.7309C18.3858 13.9784 20.8008 13.2076 21.48 10.9276C21.685 10.2376 22 6.10256 22 5.52923C22 4.95423 21.8842 3.97839 21.2483 3.6909C20.6992 3.44256 19.8617 3.17423 17.665 4.72423C15.3717 6.34506 12.9058 9.62756 12 11.3884Z"/></svg> </a> <a rel="me" href="https://linkedin.com/company/getkirby"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" data-type="linkedin" viewBox="0 0 24 24" role="img" aria-labelledby="154691be-e757-4f82-a6b2-718c64dec3c2"><title id="154691be-e757-4f82-a6b2-718c64dec3c2">LinkedIn</title><path d="M6.94048 4.99993C6.94011 5.81424 6.44608 6.54702 5.69134 6.85273C4.9366 7.15845 4.07187 6.97605 3.5049 6.39155C2.93793 5.80704 2.78195 4.93715 3.1105 4.19207C3.43906 3.44699 4.18654 2.9755 5.00048 2.99993C6.08155 3.03238 6.94097 3.91837 6.94048 4.99993ZM7.00048 8.47993H3.00048V20.9999H7.00048V8.47993ZM13.3205 8.47993H9.34048V20.9999H13.2805V14.4299C13.2805 10.7699 18.0505 10.4299 18.0505 14.4299V20.9999H22.0005V13.0699C22.0005 6.89993 14.9405 7.12993 13.2805 10.1599L13.3205 8.47993Z"/></svg> </a> <a rel="me" href="https://videos.getkirby.com"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" role="img" aria-labelledby="87daaf71-80d9-4b65-a1c8-2fb6a9b181ee"><title id="87daaf71-80d9-4b65-a1c8-2fb6a9b181ee">YouTube</title><path d="M12.2439 4C12.778 4.00294 14.1143 4.01586 15.5341 4.07273L16.0375 4.09468C17.467 4.16236 18.8953 4.27798 19.6037 4.4755C20.5486 4.74095 21.2913 5.5155 21.5423 6.49732C21.942 8.05641 21.992 11.0994 21.9982 11.8358L21.9991 11.9884L21.9991 11.9991C21.9991 11.9991 21.9991 12.0028 21.9991 12.0099L21.9982 12.1625C21.992 12.8989 21.942 15.9419 21.5423 17.501C21.2878 18.4864 20.5451 19.261 19.6037 19.5228C18.8953 19.7203 17.467 19.8359 16.0375 19.9036L15.5341 19.9255C14.1143 19.9824 12.778 19.9953 12.2439 19.9983L12.0095 19.9991L11.9991 19.9991C11.9991 19.9991 11.9956 19.9991 11.9887 19.9991L11.7545 19.9983C10.6241 19.9921 5.89772 19.941 4.39451 19.5228C3.4496 19.2573 2.70692 18.4828 2.45587 17.501C2.0562 15.9419 2.00624 12.8989 2 12.1625V11.8358C2.00624 11.0994 2.0562 8.05641 2.45587 6.49732C2.7104 5.51186 3.45308 4.73732 4.39451 4.4755C5.89772 4.05723 10.6241 4.00622 11.7545 4H12.2439ZM9.99911 8.49914V15.4991L15.9991 11.9991L9.99911 8.49914Z"/></svg> </a> <a rel="me" href="https://chat.getkirby.com"> <?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" role="img" aria-labelledby="77dfbeda-c850-4ea3-a10f-64403afa97f6"><title id="77dfbeda-c850-4ea3-a10f-64403afa97f6">Discord</title><path d="M19.3034 5.33716C17.9344 4.71103 16.4805 4.2547 14.9629 4C14.7719 4.32899 14.5596 4.77471 14.411 5.12492C12.7969 4.89144 11.1944 4.89144 9.60255 5.12492C9.45397 4.77471 9.2311 4.32899 9.05068 4C7.52251 4.2547 6.06861 4.71103 4.70915 5.33716C1.96053 9.39111 1.21766 13.3495 1.5891 17.2549C3.41443 18.5815 5.17612 19.388 6.90701 19.9187C7.33151 19.3456 7.71356 18.73 8.04255 18.0827C7.41641 17.8492 6.82211 17.5627 6.24904 17.2231C6.39762 17.117 6.5462 17.0003 6.68416 16.8835C10.1438 18.4648 13.8911 18.4648 17.3082 16.8835C17.4568 17.0003 17.5948 17.117 17.7434 17.2231C17.1703 17.5627 16.576 17.8492 15.9499 18.0827C16.2789 18.73 16.6609 19.3456 17.0854 19.9187C18.8152 19.388 20.5875 18.5815 22.4033 17.2549C22.8596 12.7341 21.6806 8.80747 19.3034 5.33716ZM8.5201 14.8459C7.48007 14.8459 6.63107 13.9014 6.63107 12.7447C6.63107 11.5879 7.45884 10.6434 8.5201 10.6434C9.57071 10.6434 10.4303 11.5879 10.4091 12.7447C10.4091 13.9014 9.57071 14.8459 8.5201 14.8459ZM15.4936 14.8459C14.4535 14.8459 13.6034 13.9014 13.6034 12.7447C13.6034 11.5879 14.4323 10.6434 15.4936 10.6434C16.5442 10.6434 17.4038 11.5879 17.3825 12.7447C17.3825 13.9014 16.5548 14.8459 15.4936 14.8459Z"/></svg> </a> </nav> <p class="mb-3 color-gray-700 flex items-center"> 🇪🇺 Made in Europe </p> </div> <nav aria-label="Footer menu" class="footer-menu"> <ul class="footer-menu-1 columns" style="--columns-sm: 2; --columns-md: 3; --columns: 3; --column-gap: var(--spacing-8); --row-gap: var(--spacing-6)"> <li> <p class="font-bold mb-1">The CMS</p> <ul class="footer-menu-2"> <li><a href="https://getkirby.com/for/developers">For developers</a></li> <li><a href="https://getkirby.com/for/designers">For designers</a></li> <li><a href="https://getkirby.com/for/creators">For content creators</a></li> <li><a href="https://getkirby.com/for/clients">For clients & agencies</a></li> <li><a href="https://getkirby.com/for/artists">For artists</a></li> <li><a href="https://getkirby.com/for/events">For events</a></li> <li><a href="https://getkirby.com/for/education">For education</a></li> <li><a href="https://getkirby.com/for/hospitality">For hospitality</a></li> <li><a href="https://getkirby.com/love">Showcase</a></li> <li><a href="https://getkirby.com/releases">Releases</a></li> <li><a class="is-external" href="https://feedback.getkirby.com">Feedback</a></li> </ul> </li> <li> <p class="font-bold mb-1">Docs</p> <ul class="footer-menu-2"> <li><a href="https://getkirby.com/docs/guide/quickstart">Guide</a></li> <li><a href="https://getkirby.com/docs/reference">Reference</a></li> <li><a href="https://getkirby.com/docs/cookbook">Cookbook</a></li> <li><a href="https://getkirby.com/docs/quicktips">Quicktips</a></li> <li><a class="is-external" href="https://www.youtube.com/kirbycasts">Screencasts</a></li> <li><a href="https://getkirby.com/docs/glossary">Glossary</a></li> <li><a href="https://getkirby.com/docs/archive">Archive</a></li> </ul> </li> <li> <p class="font-bold mb-1">Resources</p> <ul class="footer-menu-2"> <li><a class="is-external" href="https://plugins.getkirby.com">Plugins</a></li> <li><a href="https://getkirby.com/themes">Themes</a></li> <li><a href="https://getkirby.com/kosmos">Newsletter</a></li> <li><a href="https://getkirby.com/buzz">Buzz</a></li> <li><a class="is-external" href="https://pixels.getkirby.com">Pixels</a></li> <li><a class="is-external" href="https://hub.getkirby.com">License Hub</a></li> </ul> </li> <li> <p class="font-bold mb-1">Community</p> <ul class="footer-menu-2"> <li><a href="https://getkirby.com/meet">Get together</a></li> <li><a class="is-external" href="https://forum.getkirby.com">Support forum</a></li> <li><a class="is-external" href="https://chat.getkirby.com">Discord chat</a></li> <li><a class="is-external" href="https://community.getkirby.com">Community map</a></li> <li><a class="is-external" href="https://mastodon.social/@getkirby">Mastodon</a></li> <li><a class="is-external" href="https://www.linkedin.com/company/getkirby">LinkedIn</a></li> </ul> </li> <li> <p class="font-bold mb-1">Kirby</p> <ul class="footer-menu-2"> <li><a href="https://getkirby.com/security">Security</a></li> <li><a href="https://getkirby.com/privacy">Privacy</a></li> <li><a href="https://getkirby.com/license/2025-03-18">License</a></li> <li><a href="https://getkirby.com/press">Presskit</a></li> <li><a href="https://getkirby.com/team">Team</a></li> <li><a href="https://getkirby.com/contact">Contact</a></li> </ul> </li> <li> <p class="font-bold mb-3">With support of</p> <ul class="footer-menu-2 footer-menu-partners"> <li class="mb-3"> <a href="https://keycdn.com"> <?xml version="1.0"?> <svg role="img" aria-labelledby="keycdn-icon" viewBox="0 0 151 44"> <title id="keycdn-icon">KeyCDN</title> <path d="m4.54 35.12c.42.02.85.08 1.25.22l.06.02 5.29-5.15.2.26c.27.37.56.7.86 1.05l.12.13.22.24.13.13.13.13.11.1.13.14.12.11.14.13.13.11a14.16 14.16 0 0 0 16.3 1.39l.4.42 1.43 1.5a16.62 16.62 0 0 1 -9.44 2.64 16.6 16.6 0 0 1 -10.27-3.88l.01-.03-3.39 3.34a4.2 4.2 0 0 1 -4.04 5.45 4.23 4.23 0 0 1 0-8.45h.1zm32.3-21.8a16.62 16.62 0 0 1 -1.75 19.65l.02.02 2.08 2.2a2.63 2.63 0 0 1 2.17 4.5 2.6 2.6 0 1 1 -4.36-2.4c-.97-1.02-2.68-2.85-3.67-3.88l-.21-.23.24-.2a13.98 13.98 0 0 0 5.28-10.65 14 14 0 0 0 -1.74-7.16l1.94-1.84zm-29.44-9.86a2.6 2.6 0 0 1 2.62 3.1l4 4.2-.23.2a14.09 14.09 0 0 0 -3.55 17.83l-1.94 1.88a16.76 16.76 0 0 1 1.72-19.7l-2.2-2.3a2.63 2.63 0 0 1 -2.17-4.5c.41-.38.94-.62 1.5-.69l.24-.02zm33.71-3.36a4.23 4.23 0 1 1 -1.31 8.24l-.07-.02-5.73 5.44-.2-.26c-.3-.4-.64-.8-1-1.18l-.06-.08-.18-.17-.03-.04-.12-.1-.03-.04-.15-.15-.1-.1-.12-.1-.15-.12-.11-.1-.15-.13a14.03 14.03 0 0 0 -16.2-1.34l-1.85-1.92a16.62 16.62 0 0 1 19.7 1.27h.03l3.8-3.6a4.22 4.22 0 0 1 4.03-5.5z"/><path d="m22.7 9.53a12.46 12.46 0 0 1 12.23 13.99 12.46 12.46 0 0 1 -13.89 10.8 12.46 12.46 0 0 1 -10.8-13.89 12.48 12.48 0 0 1 12.46-10.9zm-.19 5.34a5.11 5.11 0 0 0 -4.83 5.08 5.12 5.12 0 0 0 2.83 4.56l-.96 4.51h6.45l-.96-4.51a5.1 5.1 0 0 0 2.83-4.56 5.1 5.1 0 0 0 -5.09-5.09h-.26zm.1-.03h-.02z"/><path d="m55.83 15.93c-.31 0-.53.06-.9.56l-5.21 6.78 2.26-12.7c.09-.47-.16-.63-.54-.63h-4.7c-.57 0-.72.28-.79.63l-4.04 22.92c-.1.5.22.7.56.7h4.7c.35 0 .7-.35.76-.7l1.25-7.15 2.73 7.15c.2.5.44.7.79.7h5.64c.41 0 .57-.38.41-.7l-4.01-8.78 7.15-8.12c.25-.25.22-.66-.22-.66zm21.84 6.46c0-3.73-2.14-6.74-6.68-6.74-5.24 0-8.82 2.32-9.85 8.53l-.35 2.07c-.1.56-.12 1.1-.12 1.6 0 4.45 3.45 6.62 6.93 6.62 2.63 0 4.77-.32 6.87-.98.53-.15.69-.37.78-.87l.5-2.83v-.12c0-.28-.19-.41-.47-.41h-.12c-1.2.13-4.36.25-6.02.25-1.57 0-2.58-.22-2.58-1.79 0-.28.03-.6.1-.97h9.75a.8.8 0 0 0 .79-.69l.3-1.88c.1-.6.17-1.2.17-1.79zm-5.65-.22c0 .38-.06.82-.16 1.26h-4.64c.38-1.8 1.13-3.1 2.89-3.1 1.4 0 1.91.74 1.91 1.84zm26.76-5.77c0-.25-.28-.47-.57-.47h-5.17c-.35 0-.66.25-.79.6l-4.48 11.35h-.25c-.19 0-.22-.16-.25-.53l-.57-10.8c-.03-.34-.15-.62-.5-.62h-5.05c-.53 0-.78.25-.78.6v.09l1.82 14.93c.18 1.6 1 2.16 2.47 2.16h.41l-.44 1.04c-.37.9-1.03 1.19-1.91 1.19-1.2 0-3.07-.19-4.23-.25h-.04a.87.87 0 0 0 -.81.66l-.53 3.04v.1c0 .28.28.37.6.5.8.31 2.88.56 4.13.56 4.93 0 6.71-1.94 8.25-5.3l8.63-18.63a.58.58 0 0 0 .06-.22zm13.93.25c0-.31-.18-.4-.53-.5-.85-.22-2.35-.5-4.2-.5-4.83 0-7.94 2.41-8.94 8.25l-.4 2.35c-.1.63-.16 1.22-.16 1.79 0 3.67 2.13 6.43 6.17 6.43 1.85 0 3.3-.25 4.4-.5.43-.1.68-.26.75-.66l.62-3.52v-.12c0-.28-.21-.47-.5-.47h-.06c-1.1.06-2.1.19-3.64.19-1.06 0-1.7-.38-1.7-1.8 0-.37.04-.8.13-1.34l.41-2.35c.44-2.6 1.35-3.17 2.7-3.17 1.54 0 2.48.16 3.54.22h.07c.34 0 .65-.25.72-.6l.62-3.54zm19.58-6.18c0-.31-.28-.53-.6-.53h-4.67a.77.77 0 0 0 -.72.63l-.94 5.3c-.63-.1-1.7-.22-2.2-.22-5.7 0-8.56 2.38-9.6 8.18l-.43 2.45c-.1.56-.16 1.1-.16 1.6 0 3.86 2.67 6.59 6.96 6.59a37 37 0 0 0 7.18-.79c1-.22 1.16-.4 1.26-1l3.92-22.11zm-7.81 10.29-1.5 8.6c-.6.09-1.26.15-2.17.15-1.35 0-1.82-.78-1.82-2 0-.38.03-.8.13-1.23l.44-2.45c.3-1.82 1.06-3.2 2.82-3.2.75 0 1.47.07 2.1.13zm25.28.22c0-3.51-1.44-5.33-4.92-5.33-1.16 0-2.89.28-5.08 1.72l.15-.81c.1-.47-.12-.63-.53-.63h-4.3a.77.77 0 0 0 -.72.63l-3 16.93c-.07.44.27.7.71.7h4.49c.47 0 .78-.32.85-.7l2.13-12.13a6.39 6.39 0 0 1 2.66-.7c1.07 0 1.48.26 1.48 1.23 0 .53-.13 1.07-.22 1.6l-1.76 10c-.06.32 0 .7.54.7h4.7c.38 0 .72-.35.78-.7l1.73-9.78c.16-.88.31-1.91.31-2.73zm-25.21 19.72c0-.08-.06-.14-.16-.14h-.84c-.1 0-.2.07-.23.18l-.18 1.07v.04c0 .08.06.15.15.15h.85c.1 0 .2-.09.23-.19l.18-1.07zm5.35-4.11c-1.23 0-2.24.51-2.57 2.3l-.16.88c-.03.17-.05.33-.05.49 0 1.08.73 1.82 1.81 1.82.58 0 1.02-.07 1.24-.13.2-.04.21-.1.24-.24l.11-.62c.02-.12-.02-.16-.17-.14-.34.04-.62.06-1.24.06-.39 0-.74-.12-.74-.76 0-.14.01-.3.05-.48l.16-.88c.18-.98.68-1.24 1.13-1.24.62 0 .9.03 1.21.07.15.02.2-.04.22-.15l.11-.61c.03-.16 0-.21-.16-.25-.2-.06-.61-.12-1.2-.12zm7.64 1.87c0-1-.6-1.87-1.9-1.87-1.49 0-2.4.8-2.68 2.36l-.14.77c-.03.15-.04.3-.04.45 0 1 .6 1.9 1.9 1.9 1.48 0 2.37-.8 2.67-2.35l.14-.77c.03-.16.05-.33.05-.5zm-1.26.07c0 .12-.01.27-.04.42l-.14.77c-.16.88-.57 1.28-1.24 1.28-.56 0-.83-.3-.83-.87 0-.12.01-.26.04-.41l.14-.77c.17-.94.66-1.28 1.24-1.28.56 0 .83.3.83.86zm10.57-.56c0-.85-.4-1.38-1.3-1.38-.66 0-1.2.15-1.67.46-.17-.24-.48-.46-1.02-.46-.56 0-.96.2-1.4.45l.04-.2c.02-.1-.04-.19-.16-.19h-.83c-.1 0-.2.09-.22.2l-.87 4.95c-.02.12.04.2.15.2h.88c.17 0 .2-.1.22-.2l.68-3.83c.42-.2.73-.31.92-.31.4 0 .54.1.54.45 0 .13 0 .28-.04.47l-.57 3.22c-.03.14.04.2.15.2h.87c.17 0 .21-.1.23-.2l.57-3.22c.04-.24.05-.49.05-.68.37-.18.77-.24.95-.24.41 0 .57.11.57.48a3 3 0 0 1 -.05.44l-.56 3.22c-.02.12.03.2.15.2h.87c.18 0 .2-.1.23-.2l.56-3.22c.04-.22.06-.42.06-.6z"/> </svg> </a> </li> <li> <a href="https://algolia.com"> <?xml version="1.0"?> <svg role="img" aria-labelledby="algolia-icon" viewBox="0 0 2196.2 500"> <title id="algolia-icon">Algolia</title> <rect width="62.58" height="277.9" x="1845.88" y="104.73" rx="5.9" ry="5.9"/> <path d="M1070.38 275.3V5.91c0-3.63-3.24-6.39-6.82-5.83l-50.46 7.94a5.91 5.91 0 0 0-4.99 5.84l.17 273.22c0 12.92 0 92.7 95.97 95.49 3.33.1 6.09-2.58 6.09-5.91v-40.78c0-2.96-2.19-5.51-5.12-5.84-34.85-4.01-34.85-47.57-34.85-54.72Zm781.4-203.92h50.77c3.26 0 5.9-2.64 5.9-5.9V5.9c0-3.62-3.24-6.39-6.82-5.83l-50.77 7.95a5.9 5.9 0 0 0-4.99 5.83v51.62c0 3.26 2.64 5.9 5.9 5.9Zm-87.75 203.92V5.91c0-3.63-3.24-6.39-6.82-5.83l-50.46 7.94a5.91 5.91 0 0 0-4.99 5.84l.17 273.22c0 12.92 0 92.7 95.97 95.49 3.33.1 6.09-2.58 6.09-5.91v-40.78c0-2.96-2.19-5.51-5.12-5.84-34.85-4.01-34.85-47.57-34.85-54.72Zm-132.08-132.58c-11.14-12.25-24.83-21.65-40.78-28.31-15.92-6.53-33.26-9.85-52.07-9.85-18.78 0-36.15 3.17-51.92 9.85-15.59 6.66-29.29 16.05-40.76 28.31-11.47 12.23-20.38 26.87-26.76 44.03-6.38 17.17-9.24 37.37-9.24 58.36s3.19 36.87 9.55 54.21c6.38 17.32 15.14 32.11 26.45 44.36 11.29 12.23 24.83 21.62 40.6 28.46 15.77 6.83 40.12 10.33 52.4 10.48 12.25 0 36.78-3.82 52.7-10.48 15.92-6.68 29.46-16.23 40.78-28.46 11.29-12.25 20.05-27.04 26.25-44.36 6.22-17.34 9.24-33.22 9.24-54.21s-3.34-41.19-10.03-58.36c-6.38-17.17-15.14-31.8-26.43-44.03Zm-44.43 163.75c-11.47 15.75-27.56 23.7-48.09 23.7-20.55 0-36.63-7.8-48.1-23.7-11.47-15.75-17.21-34.01-17.21-61.2 0-26.89 5.59-49.14 17.06-64.87 11.45-15.75 27.54-23.52 48.07-23.52 20.55 0 36.63 7.78 48.09 23.52 11.47 15.57 17.36 37.98 17.36 64.87 0 27.19-5.72 45.3-17.19 61.2Zm-693.1-201.74h-49.33c-48.36 0-90.91 25.48-115.75 64.1-14.52 22.58-22.99 49.63-22.99 78.73 0 44.89 20.13 84.92 51.59 111.1 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 1.23 0 2.46-.03 3.68-.09.36-.02.71-.05 1.07-.07.87-.05 1.75-.11 2.62-.2.34-.03.68-.08 1.02-.12.91-.1 1.82-.21 2.73-.34.21-.03.42-.07.63-.1 32.89-5.07 61.56-30.82 70.9-62.81v57.83c0 3.26 2.64 5.9 5.9 5.9h50.42c3.26 0 5.9-2.64 5.9-5.9V110.63c0-3.26-2.64-5.9-5.9-5.9zm0 206.92c-12.2 10.16-27.97 13.98-44.84 15.12-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-42.24 0-77.12-35.89-77.12-79.37 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33zm1239.55-206.92h-49.33c-48.36 0-90.91 25.48-115.75 64.1-14.52 22.58-22.99 49.63-22.99 78.73 0 44.89 20.13 84.92 51.59 111.1 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 1.23 0 2.46-.03 3.68-.09.36-.02.71-.05 1.07-.07.87-.05 1.75-.11 2.62-.2.34-.03.68-.08 1.02-.12.91-.1 1.82-.21 2.73-.34.21-.03.42-.07.63-.1 32.89-5.07 61.56-30.82 70.9-62.81v57.83c0 3.26 2.64 5.9 5.9 5.9h50.42c3.26 0 5.9-2.64 5.9-5.9V110.63c0-3.26-2.64-5.9-5.9-5.9zm0 206.92c-12.2 10.16-27.97 13.98-44.84 15.12-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-42.24 0-77.12-35.89-77.12-79.37 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33zm-819.92-206.92h-49.33c-48.36 0-90.91 25.48-115.75 64.1-11.79 18.34-19.6 39.64-22.11 62.59a148.5 148.5 0 0 0 .05 32.73c4.28 38.09 23.14 71.61 50.66 94.52 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 17.99 0 34.61-5.93 48.16-15.97 16.29-11.58 28.88-28.54 34.48-47.75v50.26h-.11v11.08c0 21.84-5.71 38.27-17.34 49.36-11.61 11.08-31.04 16.63-58.25 16.63-11.12 0-28.79-.59-46.6-2.41-2.83-.29-5.46 1.5-6.27 4.22l-12.78 43.11c-1.02 3.46 1.27 7.02 4.83 7.53 21.52 3.08 42.52 4.68 54.65 4.68 48.91 0 85.16-10.75 108.89-32.21 21.48-19.41 33.15-48.89 35.2-88.52V110.63c0-3.26-2.64-5.9-5.9-5.9h-56.32Zm0 64.1s.65 139.13 0 143.36c-12.08 9.77-27.11 13.59-43.49 14.7-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-1.32 0-2.63-.03-3.94-.1-40.41-2.11-74.52-37.26-74.52-79.38 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33ZM249.83 0C113.3 0 2 110.09.03 246.16c-2 138.19 110.12 252.7 248.33 253.5 42.68.25 83.79-10.19 120.3-30.03 3.56-1.93 4.11-6.83 1.08-9.51l-23.38-20.72c-4.75-4.21-11.51-5.4-17.36-2.92-25.48 10.84-53.17 16.38-81.71 16.03-111.68-1.37-201.91-94.29-200.13-205.96 1.76-110.26 92-199.41 202.67-199.41h202.69v360.27l-115-102.18c-3.72-3.31-9.42-2.66-12.42 1.31-18.46 24.44-48.53 39.64-81.93 37.34-46.33-3.2-83.87-40.5-87.34-86.81-4.15-55.24 39.63-101.52 94-101.52 49.18 0 89.68 37.85 93.91 85.95.38 4.28 2.31 8.27 5.52 11.12l29.95 26.55c3.4 3.01 8.79 1.17 9.63-3.3 2.16-11.55 2.92-23.58 2.07-35.92-4.82-70.34-61.8-126.93-132.17-131.26-80.68-4.97-148.13 58.14-150.27 137.25-2.09 77.1 61.08 143.56 138.19 145.26 32.19.71 62.03-9.41 86.14-26.95l150.26 133.2c6.44 5.71 16.61 1.14 16.61-7.47V9.48c-.01-5.23-4.25-9.48-9.49-9.48z"/> </svg> </a> </li> </ul> </li> </ul> </nav> </div> </div> </footer> </body> </html>