PageSourceSearch

https://roots.io/

html roots.io collected 2026-09-24 15:17:01 UTC 100,273 bytes, 1,145 lines download raw bytes

1<!doctype html>
2<html lang="en-US">
3  <head>
4    <meta charset="utf-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1">
6    <title>Roots | Modern WordPress Development</title>
7<meta name="robots" content="max-snippet:-1,max-image-preview:standard,max-video-preview:-1" />
8<link rel="canonical" href="https://roots.io/" />
9<meta name="description" content="Roots helps you build better WordPress sites faster. Open-source tools that cover the full WordPress stack for the professional developer." />
10<meta property="og:type" content="website" />
11<meta property="og:locale" content="en_US" />
12<meta property="og:site_name" content="Roots" />
13<meta property="og:title" content="Roots | Modern WordPress Development" />
14<meta property="og:description" content="Roots helps you build better WordPress sites faster. Open-source tools that cover the full WordPress stack for the professional developer." />
15<meta property="og:url" content="https://roots.io/" />
16<meta property="og:image" content="https://roots.io/app/uploads/social/2.png" />
17<meta name="twitter:card" content="summary_large_image" />
18<meta name="twitter:title" content="Roots | Modern WordPress Development" />
19<meta name="twitter:description" content="Roots helps you build better WordPress sites faster. Open-source tools that cover the full WordPress stack for the professional developer." />
20<meta name="twitter:image" content="https://roots.io/app/uploads/social/2.png" />
21<style id="wp-img-auto-sizes-contain-inline-css">
22img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}
23/*# sourceURL=wp-img-auto-sizes-contain-inline-css */
24</style>
25<script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","url":"https://roots.io/","name":"roots.io","alternateName":"Roots","description":"Open-source tools that cover the full WordPress stack for the professional developer","logo":"https://cdn.roots.io/icon-512.png","sameAs":["https://twitter.com/rootswp","https://github.com/roots","https://www.youtube.com/@rootsdev"],"@id":"https://roots.io/"}</script>
25<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","url":"https://roots.io/","name":"roots.io","alternateName":"Roots"}</script>
25<script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Roots","item":"https://roots.io"},{"@type":"ListItem","position":2,"name":"Home","item":"https://roots.io/"}]}</script>
25<link rel="alternate" type="text/markdown" href="https://roots.io/home.md">
26    <link rel="icon" href="/favicon.ico" sizes="any">
27    <link rel="icon" href="/icon.svg" type="image/svg+xml">
28    <link rel="apple-touch-icon" href="/apple-touch-icon.png">
29    <link rel="manifest" href="/manifest.webmanifest">
30<link rel="preload" href="https://roots.io/build/assets/JetBrainsMono-Regular-BQaDgvhP.woff2" as="font" type="font/woff2" crossorigin><link rel="preload" href="https://roots.io/build/assets/public-sans-v11-latin-300-BpOl3AGj.woff2" as="font" type="font/woff2" crossorigin><link rel="preload" href="https://roots.io/build/assets/public-sans-v11-latin-700-Dhs3Ot1f.woff2" as="font" type="font/woff2" crossorigin><link rel="preload" href="https://roots.io/build/assets/public-sans-v11-latin-700italic-D-gsQCW5.woff2" as="font" type="font/woff2" crossorigin><link rel="preload" href="https://roots.io/build/assets/public-sans-v11-latin-italic-DjL0qRqq.woff2" as="font" type="font/woff2" crossorigin><link rel="preload" href="https://roots.io/build/assets/public-sans-v11-latin-regular--iDDObp1.woff2" as="font" type="font/woff2" crossorigin><link rel="icon" href="https://roots.io/icon-512.png" sizes="32x32">
31<link rel="icon" href="https://roots.io/icon-512.png" sizes="192x192">
32<link rel="apple-touch-icon" href="https://roots.io/icon-512.png">
33<meta name="msapplication-TileImage" content="https://roots.io/icon-512.png">
34
35    <link rel="preload" as="style" href="https://roots.io/build/assets/app-DKygelke.css" /><link rel="modulepreload" as="script" href="https://roots.io/build/assets/app-CtyiJV6m.js" /><link rel="stylesheet" href="https://roots.io/build/assets/app-DKygelke.css" />
35<script type="module" src="https://roots.io/build/assets/app-CtyiJV6m.js"></script>
35      </head>
36
37  <body class="home wp-singular page wp-embed-responsive wp-theme-roots bg-white">
38    <div id="app">
39      <a class="sr-only focus:not-sr-only" href="#main">
40        Skip to content
41      </a>
42
43      <div class="flex flex-col h-screen">
44        <div>
45          <header class="relative border-b border-b-brand-lighter">
46  <div class="flex max-w-6xl p-4 mx-auto lg:grid lg:grid-cols-[1fr_auto_1fr] lg:items-center relative" x-data="{ brandMenuOpen: false }">
47    <a
48      href="https://roots.io/"
49      class="z-20 pb-px w-fit"
50      @contextmenu.prevent="brandMenuOpen = !brandMenuOpen"
51      @contextmenu.away="brandMenuOpen = false"
52      @click.away="brandMenuOpen = false"
53    >
54      <svg class="h-12 w-auto" width="207" height="76" viewBox="0 0 207 76" xmlns="http://www.w3.org/2000/svg"><g fill="#525DDC" fill-rule="evenodd"><path d="M57.604 60.32c-5.97-5.962-9.26-13.89-9.26-22.318V24.958a.815.815 0 1 0-1.631 0c0 8.43-3.286 16.36-9.255 22.32L17.743 66.961a.813.813 0 0 0-.237.643.81.81 0 0 0 .34.6C24.665 73.05 32.672 75.61 41 75.61s16.338-2.56 23.157-7.406a.79.79 0 0 0 .334-.6.796.796 0 0 0-.227-.643l-6.66-6.64zm-35.38-48.398V1.816A.813.813 0 0 0 21 1.11C8.663 8.242.999 21.484.999 35.67c0 1.136.06 2.352.188 3.718.032.312.24.58.537.694a.979.979 0 0 0 .278.044.816.816 0 0 0 .574-.236L16.32 26.164a19.997 19.997 0 0 0 5.903-14.242zM60.997 1.11a.808.808 0 0 0-.816 0 .82.82 0 0 0-.408.706v36.186c0 5.378 2.103 10.437 5.911 14.242l6.655 6.65a.82.82 0 0 0 .579.241c.022 0 .046 0 .07-.005a.852.852 0 0 0 .601-.338C78.437 51.979 81 43.985 81 35.669 81 21.484 73.341 8.242 60.998 1.11zM29.377 39.203L9.662 58.894a.815.815 0 0 1-.579.241c-.021 0-.044 0-.065-.005a.827.827 0 0 1-.596-.338 39.91 39.91 0 0 1-2.962-4.84.824.824 0 0 1 .15-.957l18.793-18.76c5.967-5.965 9.253-13.887 9.253-22.313a.816.816 0 0 1 1.631 0v13.036c0 5.38-2.097 10.44-5.91 14.245zM128.08 32.38c0 4.18-2.66 6.84-5.7 7.6v.38l4.94 6.46v3.8l-.38.38h-2.28l-.76-.38-7.6-9.88-.76-.38h-3.8l-.38.38v9.88l-.38.38h-4.56l-.38-.38V24.78l.38-.38h12.54c5.32 0 9.12 2.66 9.12 7.98zm-5.32 0c0-2.66-1.52-3.42-3.8-3.42h-7.22l-.38.38v6.08l.38.38h7.22c2.28 0 3.8-.76 3.8-3.42zm26.98 9.12c0 6.08-3.8 9.88-9.5 9.88s-9.5-3.8-9.5-9.88c0-6.08 3.8-9.88 9.5-9.88s9.5 3.8 9.5 9.88zm-5.32 0c0-3.42-1.52-5.32-4.18-5.32-2.66 0-4.18 1.9-4.18 5.32 0 3.42 1.52 5.32 4.18 5.32 2.66 0 4.18-1.9 4.18-5.32zm26.6 0c0 6.08-3.8 9.88-9.5 9.88s-9.5-3.8-9.5-9.88c0-6.08 3.8-9.88 9.5-9.88s9.5 3.8 9.5 9.88zm-5.32 0c0-3.42-1.52-5.32-4.18-5.32-2.66 0-4.18 1.9-4.18 5.32 0 3.42 1.52 5.32 4.18 5.32 2.66 0 4.18-1.9 4.18-5.32zm15.96-4.56v8.36c0 .76.38 1.14 1.14 1.14h3.42l.38.38v3.8l-.38.38h-3.42c-3.42 0-6.46-1.52-6.46-5.7v-8.36l-.38-.38h-2.66l-.38-.38v-3.8l.38-.38h2.66l.38-.38V28.2l.38-.38h4.56l.38.38v3.42l.38.38h4.18l.38.38v3.8l-.38.38h-4.18l-.38.38zm24.32 8.36c0 3.04-2.28 6.08-8.36 6.08-5.32 0-8.36-2.66-8.36-6.46l.38-.38h4.56l.38.38c0 1.52 1.14 1.9 3.04 1.9 1.9 0 3.04-.38 3.04-1.52 0-1.52-1.52-1.52-3.8-1.9-2.28-.38-7.22-1.52-7.22-6.08 0-3.04 2.28-5.7 7.98-5.7 4.56 0 7.98 1.9 7.98 5.7l-.38.38h-4.56l-.38-.38c0-.76-.76-1.14-2.66-1.14-1.9 0-2.66.38-2.66 1.52 0 1.52 2.28 1.52 4.56 1.9 2.28.38 6.46 1.14 6.46 5.7z"/></g></svg>      <span class="sr-only">Roots</span>
55    </a>
56
57    <nav
58  x-data="{
59    isOpen: false,
60    closeMenu() {
61      this.isOpen = false;
62      document.querySelector('#main')?.classList.remove('lg:blur-sm');
63    }
64  }"
65  :aria-expanded="isOpen"
66  class="w-full ml-auto content-center grow inline-flex justify-center lg:justify-self-center"
67  x-on:keydown.escape.document="closeMenu()"
68>
69  <button
70    :aria-expanded="isOpen"
71    aria-controls="nav-primary"
72    aria-label="Reveal navigation"
73    @click="isOpen = !isOpen"
74    class="block ml-auto lg:hidden"
75  >
76    <svg class="w-10 h-10 text-brand-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
77  <path fill-rule="evenodd" d="M3 5.25a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75A.75.75 0 0 1 3 5.25Zm0 4.5A.75.75 0 0 1 3.75 9h16.5a.75.75 0 0 1 0 1.5H3.75A.75.75 0 0 1 3 9.75Zm0 4.5a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75a.75.75 0 0 1-.75-.75Zm0 4.5a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75a.75.75 0 0 1-.75-.75Z" clip-rule="evenodd"/>
78</svg>  </button>
79
80  <div
81    x-show="isOpen"
82    @click="closeMenu()"
83    class="fixed inset-0 z-10 bg-transparent lg:hidden"
84    x-cloak
85  ></div>
86
87  <div
88    x-cloak
89    id="nav-primary"
90    x-bind:class="{ 'hidden': !isOpen, '': isOpen }"
91    class="
92      absolute top-0 right-0 z-20
93      w-full min-h-screen
94      bg-white
95      lg:min-h-0 lg:w-auto lg:h-auto lg:flex lg:static lg:items-center
96    "
97  >
98    <button
99      :aria-expanded="isOpen"
100      aria-controls="nav-primary"
101      @click="isOpen = !isOpen"
102      class="block mt-4 mb-6 ml-auto mr-4 lg:hidden z-10 relative"
103    >
104      <svg class="w-10 h-10 text-brand-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
105  <path fill-rule="evenodd" d="M5.47 5.47a.75.75 0 0 1 1.06 0L12 10.94l5.47-5.47a.75.75 0 1 1 1.06 1.06L13.06 12l5.47 5.47a.75.75 0 1 1-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 0 1-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd"/>
106</svg>    </button>
107
108    <ul
109      class="
110        w-full
111        py-2
112        -mt-[70px]
113        lg:mt-0 lg:flex lg:py-0
114      "
115    >
116              
117        <li
118          class="has-dropdown"
119                      x-data="{
120              open: false,
121              init() {
122                this.$watch('open', (value) => {
123                  if (value) {
124                    document.querySelector('#main').classList.add('lg:blur-sm');
125
126                    this.$nextTick(() => {
127                      const dropdownItems = document.querySelectorAll('.dropdown-item:not([hidden])');
128                      if (dropdownItems.length > 0) {
129                        const lastItem = dropdownItems[dropdownItems.length - 1];
130                        const rect = lastItem.getBoundingClientRect();
131                        const isVisible = rect.bottom <= (window.innerHeight - 50);
132
133                        if (isVisible) {
134                          document.querySelector('html').classList.add('lg:overflow-hidden', 'lg:h-full');
135                          document.querySelector('body').classList.add('lg:overflow-hidden', 'lg:h-full');
136                        }
137                      }
138                    });
139                  }
140
141                  if (!value) {
142                    document.querySelector('#main').classList.remove('lg:blur-sm');
143                    document.querySelector('html').classList.remove('lg:overflow-hidden', 'lg:h-full');
144                    document.querySelector('body').classList.remove('lg:overflow-hidden', 'lg:h-full');
145                  }
146                });
147              }
148            }"
149                  >
150          <button
151            class="
152              text-brand-primary
153              group
154              inline-flex items-center
155              xl:flex
156              px-4 py-2
157              lg:px-3
158              text-xl lg:text-base
159              hover:text-brand-700
160              w-auto
161              cursor-pointer
162            "
163                          :class="open ? 'text-brand-navy' : ''"
164              x-on:click="open = !open"
165                                  >
166            Ecosystem
167          </button>
168
169                                    <div class="z-10 mx-4 lg:mx-0 lg:absolute lg:left-0 lg:w-full lg:top-full lg:min-h-screen" x-cloak :hidden="!open" @click.self="open = false" @keydown.escape.window="open = false">
170                <div class="flex flex-col gap-2 mt-2 lg:max-w-xl lg:mx-auto lg:mt-6">
171                  <a class="dropdown-item  flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/radicle/">
172    <div class="flex items-center">
173      <svg class="h-4 w-4 lg:size-6 mr-2 flex-shrink-0 radicle-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 280 292" style="enable-background:new 0 0 280 292" xml:space="preserve"><path d="m106 1 55 55-35 10-30-30 10-35zm0 110 75 75-90 30-90-90 30-90 75 75 55-55 55-55 20 65-65 65-65-20zm145.3 4.7 28.2 91.8L196 291H76l105-105 70.3-70.3z" fill="#525DDC"/></svg>      <h2 class=" group-hover:text-brand-700 font-mono">roots/radicle</h2>
174
175          </div>
176    <p class="text-sm mt-2 text-black">Radicle is an opinionated starting point for WordPress projects with the Roots stack</p>
177  </a>
178  <a class="dropdown-item  flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/acorn/">
179    <div class="flex items-center">
180      <svg class="h-4 w-4 lg:size-6 mr-2 flex-shrink-0" width="280" height="280" viewBox="0 0 28
1800 280" xmlns="http://www.w3.org/2000/svg"><path d="M210 260h-60v-60l30-30 60 60-30 30zM95 135V95h90v40l-45 45-45-45zm35 125H70l-30-30 60-60 30 30v60zm75-130V65L140 0 75 65v65H0v85l65 65h150l65-65v-85h-75z" fill="#5361D9" fill-rule="evenodd"/></svg>      <h2 class=" group-hover:text-brand-700 font-mono">roots/acorn</h2>
181
182              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
183          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
184  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
185  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
186</svg>  1,004
187</div>
188        </div>
189          </div>
190    <p class="text-sm mt-2 text-black">Integrate Laravel functionality into WordPress projects</p>
191  </a>
192  <a class="dropdown-item  flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/bedrock/">
193    <div class="flex items-center">
194      <svg class="h-4 w-4 lg:size-6 mr-2 flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M1.233 0L0 1.233v16.034l1.057 1.057 34.886-5.815L37 13.567v11.1l35.52-5.92 1.48-1.48V1.233L72.767 0H1.233zm.247 30.587L0 32.067v9.866l1.057 1.057L37 37V24.667l-35.52 5.92zM37 37v12.334l35.52-5.92 1.48-1.48v-9.867l-1.057-1.057L37 37zM1.48 55.253L0 56.733v16.034L1.233 74h71.534L74 72.767V56.733l-1.057-1.057-34.886 5.815L37 60.434v-11.1l-35.52 5.92z" fill="#525DDC"/></svg>      <h2 class=" group-hover:text-brand-700 font-mono">roots/bedrock</h2>
195
196              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
197          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
198  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
199  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
200</svg>  6,573
201</div>
202        </div>
203          </div>
204    <p class="text-sm mt-2 text-black">WordPress boilerplate with Composer and Git, easier configuration, and an improved folder structure</p>
205  </a>
206  <a class="dropdown-item  flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/sage/">
207    <div class="flex items-center">
208      <svg class="h-4 w-4 lg:size-6 mr-2 flex-shrink-0" width="81" height="74" viewBox="0 0 81 74" xmlns="http://www.w3.org/2000/svg"><path d="M24.837 10.873l5.755 17.07-15.065-10.55L0 28.266l5.897 17.492.034.1h18.622L9.487 56.408l5.897 17.493.034.099h19.191l5.755-17.07 5.72 16.97.034.1H65.31l5.93-17.592-15.065-10.55h18.622l5.93-17.592-15.526-10.873-15.066 10.55 5.755-17.07L40.364 0 24.837 10.873zm.352 34.786l5.797-17.194h18.755l5.797 17.194-15.174 10.626-15.175-10.626z" fill="#525DDC" fill-rule="nonzero"/></svg>      <h2 class=" group-hover:text-brand-700 font-mono">roots/sage</h2>
209
210              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
211          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
212  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
213  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
214</svg>  13,280
215</div>
216        </div>
217          </div>
218    <p class="text-sm mt-2 text-black">WordPress starter theme with Laravel Blade components and templates, Tailwind CSS, and block editor support</p>
219  </a>
220  <a class="dropdown-item  flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/trellis/">
221    <div class="flex items-center">
222      <svg class="h-4 w-4 lg:size-6 mr-2 flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M60.125 0l-9.25 9.25L41.625 0H0v9.25h41.625l9.25 9.25 9.25-9.25H74V0H60.125zm-9.25 18.5l-9.25 9.25-9.25-9.25H0v9.25h32.375l9.25 9.25 9.25-9.25H74V18.5H50.875zM41.625 37l-9.25 9.25-9.25-9.25H0v9.25h23.125l9.25 9.25 9.25-9.25H74V37H41.625zm-9.25 18.5l-9.25 9.25-9.25-9.25H0v9.25h13.875l9.25 9.25 9.25-9.25H74V55.5H32.375z" fill="#525DDC" fill-rule="nonzero"/></svg>      <h2 class=" group-hover:text-brand-700 font-mono">roots/trellis</h2>
223
224              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
225          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
226  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
227  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
228</svg>  2,579
229</div>
230        </div>
231          </div>
232    <p class="text-sm mt-2 text-black">WordPress LEMP stack with PHP 8.3, Composer, WP-CLI and more</p>
233  </a>
234
235  <a class="dropdown-item  flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group" href="https://wp-packages.org/">
236    <div class="flex items-center">
237      <svg class="h-4 w-4 lg:size-6 mr-2 flex-shrink-0 text-brand-primary group-hover:text-brand-navy" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
238  <path stroke-linecap="round" stroke-linejoin="round" d="m21 7.5-9-5.25L3 7.5m18 0-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9"/>
239</svg>      <h2 class=" group-hover:text-brand-700 font-mono">roots/wp-packages</h2>
240
241              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
242          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
243  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
244  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
245</svg>  143
246</div>
247        </div>
248          </div>
249    <p class="text-sm mt-2 text-black">Manage your WordPress plugins and themes with Composer</p>
250  </a>
251                </div>
252              </div>
253                              </li>
254              
255        <li
256          class=""
257                  >
258          <a
259            class="
260              text-brand-primary
261              group
262              inline-flex items-center
263              xl:flex
264              px-4 py-2
265              lg:px-3
266              text-xl lg:text-base
267              hover:text-brand-700
268              w-auto
269              cursor-pointer
270            "
271                                      href="/getting-started/"
272                      >
273            Getting Started
274          </a>
275
276                  </li>
277              
278        <li
279          class=""
280                  >
281          <a
282            class="
283              text-brand-primary
284              group
285              inline-flex items-center
286              xl:flex
287              px-4 py-2
288              lg:px-3
289              text-xl lg:text-base
290              hover:text-brand-700
291              w-auto
292              cursor-pointer
293            "
294                                      href="/blog/"
295                      >
296            Blog
297          </a>
298
299                  </li>
300              
301        <li
302          class=""
303                  >
304          <a
305            class="
306              text-brand-primary
307              group
308              inline-flex items-center
309              xl:flex
310              px-4 py-2
311              lg:px-3
312              text-xl lg:text-base
313              hover:text-brand-700
314              w-auto
315              cursor-pointer
316            "
317                                      href="https://discourse.roots.io/tag/releases"
318                      >
319            Changelog
320          </a>
321
322                  </li>
323              
324        <li
325          class=""
326                  >
327          <a
328            class="
329              text-brand-primary
330              group
331              inline-flex items-center
332              xl:flex
333              px-4 py-2
334              lg:px-3
335              text-xl lg:text-base
336              hover:text-brand-700
337              w-auto
338              cursor-pointer
339            "
340                                      href="https://discourse.roots.io/"
341                      >
342            Community
343          </a>
344
345                  </li>
346              
347        <li
348          class=""
349                  >
350          <a
351            class="
352              text-brand-primary
353              group
354              inline-flex items-center
355              xl:flex
356              px-4 py-2
357              lg:px-3
358              text-xl lg:text-base
359              hover:text-brand-700
360              w-auto
361              cursor-pointer
362            "
363                                      href="/support/"
364                      >
365            Support
366          </a>
367
368                  </li>
369      
370      <li class="lg:hidden flex gap-2 px-4">
371        <a class="flex items-center py-2 group" href="https://github.com/roots" aria-label="GitHub"><svg class="w-6 h-6 mr-2 group-hover:fill-brand-700" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg> <span class="sr-only">GitHub</span></a>
372        <a class="flex items-center py-2 group" href="https://x.com/rootswp" aria-label="X"><svg class="w-5 h-5 mr-2 group-hover:fill-brand-700" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>X</title><path d="M14.234 10.162 22.977 0h-2.072l-7.591 8.824L7.251 0H.258l9.168 13.343L.258 24H2.33l8.016-9.318L16.749 24h6.993zm-2.837 3.299-.929-1.329L3.076 1.56h3.182l5.965 8.532.929 1.329 7.754 11.09h-3.182z"/></svg> <span class="sr-only">X</span></a>
373      </li>
374      <li class="flex items-center px-4 py-2 group lg:hidden">
375        <a
376  class="inline-flex items-center font-semibold cursor-pointer transition-colors text-white bg-brand-primary hover:bg-brand-navy active:bg-brand-navy rounded-full px-3 md:px-4 py-1.5 text-sm   gap-2 "
377
378      href="/sponsors/"
379  
380  >
381    Sponsors
382</a>
383      </li>
384  </ul>
385    </ul>
386  </div>
387</nav>
388
389<nav class="hidden lg:flex lg:justify-self-end">
390  <ul class="flex flex-row items-center gap-2">
391    <li><a class="flex items-center group" href="https://github.com/roots" aria-label="GitHub"><svg class="w-6 h-6 mr-2 group-hover:fill-brand-700" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg> <span class="lg:sr-only">GitHub</span></a></li>
392    <li><a class="flex items-center group" href="https://x.com/rootswp" aria-label="X"><svg class="w-5 h-5 mr-2 group-hover:fill-brand-700" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>X</title><path d="M14.234 10.162 22.977 0h-2.072l-7.591 8.824L7.251 0H.258l9.168 13.343L.258 24H2.33l8.016-9.318L16.749 24h6.993zm-2.837 3.299-.929-1.329L3.076 1.56h3.182l5.965 8.532.929 1.329 7.754 11.09h-3.182z"/></svg> <span class="lg:sr-only">X</span></a></li>
393    <li><a
394  class="inline-flex items-center font-semibold cursor-pointer transition-colors text-white bg-brand-primary hover:bg-brand-navy active:bg-brand-navy rounded-full px-3 md:px-4 py-1.5 text-sm   gap-2 "
395
396      href="/sponsors/"
397  
398  >
399    Sponsors
400</a>
401</li>
402  </ul>
403</nav>
404    <ul
405  x-cloak
406  x-data="copy()"
407  x-show="brandMenuOpen"
408  x-bind:style="menuStyle"
409  class="bg-white fixed z-30 border border-brand-lightest rounded-lg divide divide-y divide-brand-lightest text-xs overflow-hidden"
410  @contextmenu.window="handleRightClick($event)"
411  data-markdown-exclude
412>
413  <li>
414    <button
415      class="block px-3 py-2 hover:bg-brand-lightest text-brand-primary w-full"
416      x-data="{ url: 'https://roots.io/build/assets/roots-BfAdYMaQ.svg' }"
417      @click.prevent="copySvg(url)"
418    >
419      Copy icon as SVG
420    </button>
421  </li>
422  <li>
423    <button
424      class="block px-3 py-2 hover:bg-brand-lightest text-brand-primary w-full"
425      x-data="{ url: 'https://roots.io/build/assets/roots-CUGVBOOF.svg' }"
426      @click.prevent="copySvg(url)"
427    >
428      Copy logo as SVG
429    </button>
430  </li>
431  <li>
432    <a href="/" class="block px-3 py-2 hover:bg-brand-lightest">Home page</a>
433  </li>
434</ul>
435
436  </div>
437
438  <div
439    x-data="{ dismissed: localStorage.getItem('wp-packages-banner') === 'true' }"
440    x-show="!dismissed"
441    x-cloak
442    class="-mb-px bg-brand-navy text-white text-sm text-center px-4 py-2.5"
443  >
444    <p class="max-w-6xl mx-auto flex items-center justify-center gap-3">
445      <span>
446        <a href="https://wp-packages.org/" class="font-semibold text-white underline underline-offset-2 hover:text-brand-lightest">WP Packages</a>
447        is our new
448        <a href="https://wp-packages.org/wp-packages-vs-wpackagist" class="text-white underline underline-offset-2 hover:text-brand-lightest">WPackagist replacement</a>
449        that's 17x faster and updates every 5 minutes
450      </span>
451
452      <button
453        @click="dismissed = true; localStorage.setItem('wp-packages-banner', 'true')"
454        class="flex-shrink-0 cursor-pointer text-white/70 hover:text-white"
455        aria-label="Dismiss banner"
456      >
457        <svg class="h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
458  <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
459</svg>      </button>
460    </p>
461  </div>
462</header>
463        </div>
464
465        <main id="main" class="mb-auto">
466            <section class="bg-brand-primary text-white py-12">
467    <div class="max-w-7xl mx-auto px-5">
468      <div class="space-y-6 lg:space-y-10">
469        <h1
470    class="max-w-4xl mx-auto text-3xl font-semibold tracking-tight text-center text-white sm:text-4xl md:text-5xl lg:text-6xl"
471>
472    Advanced WordPress Development Tools
473</h1>
474        <h2
475    class="mb-6 text-2xl font-bold tracking-tight md:text-3xl lg:text-3xl max-w-5xl mx-auto text-xl font-normal text-center text-white/90 sm:text-2xl md:text-3xl lg:text-3xl tracking-tight"
476>
477    Build better WordPress sites with modern development workflows, Composer, Laravel components, and automated deployment.
478</h2>
479        <div class="flex flex-col sm:flex-row justify-center items-center gap-4 max-w-xs sm:max-w-none mx-auto">
480          <a
481  class="inline-flex items-center font-semibold cursor-pointer transition-colors text-white bg-brand-navy hover:bg-white hover:!text-brand-primary rounded-full px-8 py-4 text-lg   gap-2 w-full sm:w-auto justify-center"
482
483      href="/getting-started/"
484  
485  >
486    Get Started
487</a>
488          <a
489  class="inline-flex items-center font-semibold cursor-pointer transition-colors text-brand-primary border border-brand-primary bg-white hover:border-brand-navy hover:bg-brand-navy hover:text-white rounded-full px-8 py-4 text-lg   gap-1 w-full sm:w-auto justify-center border-white hover:border-brand-navy hover:bg-brand-navy hover:text-white"
490
491      href="https://github.com/roots"
492  
493  >
494      <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="currentColor"><path fill-rule="evenodd" d="M 16 4 C 9.371094 4 4 9.371094 4 16 C 4 21.300781 7.4375 25.800781 12.207031 27.386719 C 12.808594 27.496094 13.027344 27.128906 13.027344 26.808594 C 13.027344 26.523438 13.015625 25.769531 13.011719 24.769531 C 9.671875 25.492188 8.96875 23.160156 8.96875 23.160156 C 8.421875 21.773438 7.636719 21.402344 7.636719 21.402344 C 6.546875 20.660156 7.71875 20.675781 7.71875 20.675781 C 8.921875 20.761719 9.554688 21.910156 9.554688 21.910156 C 10.625 23.746094 
49412.363281 23.214844 13.046875 22.910156 C 13.15625 22.132813 13.46875 21.605469 13.808594 21.304688 C 11.144531 21.003906 8.34375 19.972656 8.34375 15.375 C 8.34375 14.0625 8.8125 12.992188 9.578125 12.152344 C 9.457031 11.851563 9.042969 10.628906 9.695313 8.976563 C 9.695313 8.976563 10.703125 8.65625 12.996094 10.207031 C 13.953125 9.941406 14.980469 9.808594 16 9.804688 C 17.019531 9.808594 18.046875 9.941406 19.003906 10.207031 C 21.296875 8.65625 22.300781 8.976563 22.300781 8.976563 C 22.957031 10.628906 22.546875 11.851563 22.421875 12.152344 C 23.191406 12.992188 23.652344 14.0625 23.652344 15.375 C 23.652344 19.984375 20.847656 20.996094 18.175781 21.296875 C 18.605469 21.664063 18.988281 22.398438 18.988281 23.515625 C 18.988281 25.121094 18.976563 26.414063 18.976563 26.808594 C 18.976563 27.128906 19.191406 27.503906 19.800781 27.386719 C 24.566406 25.796875 28 21.300781 28 16 C 28 9.371094 22.628906 4 16 4 Z"/></svg>    View on GitHub
495</a>
496        </div>
497      </div>
498    </div>
499  </section>
500
501  <div class="space-y-10 mt-12 md:my-4 lg:my-8 max-w-xl px-4 mx-auto">
502    <div class="flex flex-col gap-5" id="ecosystem">
503      <a class=" flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/radicle/">
504    <div class="flex items-center">
505      <svg class="h-10 w-10 mr-4  flex-shrink-0 radicle-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 280 292" style="enable-background:new 0 0 280 292" xml:space="preserve"><path d="m106 1 55 55-35 10-30-30 10-35zm0 110 75 75-90 30-90-90 30-90 75 75 55-55 55-55 20 65-65 65-65-20zm145.3 4.7 28.2 91.8L196 291H76l105-105 70.3-70.3z" fill="#525DDC"/></svg>      <h2 class="mb-1 group-hover:text-brand-700 font-mono">roots/radicle</h2>
506
507          </div>
508    <p class="mt-4 text-black">Radicle is an opinionated starting point for WordPress projects with the Roots stack</p>
509  </a>
510  <a class=" flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/acorn/">
511    <div class="flex items-center">
512      <svg class="h-10 w-10 mr-4  flex-shrink-0" width="280" height="280" viewBox="0 0 280 280" xmlns="http://www.w3.org/2000/svg"><path d="M210 260h-60v-60l30-30 60 60-30 30zM95 135V95h90v40l-45 45-45-45zm35 125H70l-30-30 60-60 30 30v60zm75-130V65L140 0 75 65v65H0v85l65 65h150l65-65v-85h-75z" fill="#5361D9" fill-rule="evenodd"/></svg>      <h2 class="mb-1 group-hover:text-brand-700 font-mono">roots/acorn</h2>
513
514              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
515          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
516  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
517  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
518</svg>  1,004
519</div>
520        </div>
521          </div>
522    <p class="mt-4 text-black">Integrate Laravel functionality into WordPress projects</p>
523  </a>
524  <a class=" flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/bedrock/">
525    <div class="flex items-center">
526      <svg class="h-10 w-10 mr-4  flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg">
526<path d="M1.233 0L0 1.233v16.034l1.057 1.057 34.886-5.815L37 13.567v11.1l35.52-5.92 1.48-1.48V1.233L72.767 0H1.233zm.247 30.587L0 32.067v9.866l1.057 1.057L37 37V24.667l-35.52 5.92zM37 37v12.334l35.52-5.92 1.48-1.48v-9.867l-1.057-1.057L37 37zM1.48 55.253L0 56.733v16.034L1.233 74h71.534L74 72.767V56.733l-1.057-1.057-34.886 5.815L37 60.434v-11.1l-35.52 5.92z" fill="#525DDC"/></svg>      <h2 class="mb-1 group-hover:text-brand-700 font-mono">roots/bedrock</h2>
527
528              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
529          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
530  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
531  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
532</svg>  6,573
533</div>
534        </div>
535          </div>
536    <p class="mt-4 text-black">WordPress boilerplate with Composer and Git, easier configuration, and an improved folder structure</p>
537  </a>
538  <a class=" flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/sage/">
539    <div class="flex items-center">
540      <svg class="h-10 w-10 mr-4  flex-shrink-0" width="81" height="74" viewBox="0 0 81 74" xmlns="http://www.w3.org/2000/svg"><path d="M24.837 10.873l5.755 17.07-15.065-10.55L0 28.266l5.897 17.492.034.1h18.622L9.487 56.408l5.897 17.493.034.099h19.191l5.755-17.07 5.72 16.97.034.1H65.31l5.93-17.592-15.065-10.55h18.622l5.93-17.592-15.526-10.873-15.066 10.55 5.755-17.07L40.364 0 24.837 10.873zm.352 34.786l5.797-17.194h18.755l5.797 17.194-15.174 10.626-15.175-10.626z" fill="#525DDC" fill-rule="nonzero"/></svg>      <h2 class="mb-1 group-hover:text-brand-700 font-mono">roots/sage</h2>
541
542              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
543          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
544  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
545  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
546</svg>  13,280
547</div>
548        </div>
549          </div>
550    <p class="mt-4 text-black">WordPress starter theme with Laravel Blade components and templates, Tailwind CSS, and block editor support</p>
551  </a>
552  <a class=" flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group [&:hover_svg]:text-brand-navy [&:hover_svg_*]:fill-brand-700 [&:hover_svg_*]:!fill-brand-700 [&:hover_svg_path]:!fill-brand-700 [&:hover_svg_circle]:!fill-brand-700 [&:hover_svg_g]:!fill-brand-700" href="/trellis/">
553    <div class="flex items-center">
554      <svg class="h-10 w-10 mr-4  flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M60.125 0l-9.25 9.25L41.625 0H0v9.25h41.625l9.25 9.25 9.25-9.25H74V0H60.125zm-9.25 18.5l-9.25 9.25-9.25-9.25H0v9.25h32.375l9.25 9.25 9.25-9.25H74V18.5H50.875zM41.625 37l-9.25 9.25-9.25-9.25H0v9.25h23.125l9.25 9.25 9.25-9.25H74V37H41.625zm-9.25 18.5l-9.25 9.25-9.25-9.25H0v9.25h13.875l9.25 9.25 9.25-9.25H74V55.5H32.375z" fill="#525DDC" fill-rule="nonzero"/></svg>      <h2 class="mb-1 group-hover:text-brand-700 font-mono">roots/trellis</h2>
555
556              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
557          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
558  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
559  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
560</svg>  2,579
561</div>
562        </div>
563          </div>
564    <p class="mt-4 text-black">WordPress LEMP stack with PHP 8.3, Composer, WP-CLI and more</p>
565  </a>
566
567  <a class=" flex flex-col p-3 bg-white border rounded-md md:p-4 border-brand-lighter hover:shadow-inner hover:shadow-sm hover:border-brand-light group" href="https://wp-packages.org/">
568    <div class="flex items-center">
569      <svg class="h-10 w-10 mr-4 flex-shrink-0 text-brand-primary group-hover:text-brand-navy" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
570  <path stroke-linecap="round" stroke-linejoin="round" d="m21 7.5-9-5.25L3 7.5m18 0-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9"/>
571</svg>      <h2 class="mb-1 group-hover:text-brand-700 font-mono">roots/wp-packages</h2>
572
573              <div class="ml-auto group-hover:text-brand-700" data-markdown-exclude>
574          <div class="flex items-center github-stars  flex-row-reverse text-sm [*]:transition-colors">
575  <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon">
576  <path fill-rule="evenodd" d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273-4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434 2.082-5.005Z" clip-rule="evenodd"/>
577</svg>  143
578</div>
579        </div>
580          </div>
581    <p class="mt-4 text-black">Manage your WordPress plugins and themes with Composer</p>
582  </a>
583    </div>
584
585    <div>
586      <div class="flex justify-between items-center mb-5">
587        <h2
588    class="mb-6 text-2xl font-bold tracking-tight md:text-3xl lg:text-3xl !mb-0"
589>
590    <a href="https://discourse.roots.io/tag/releases/61" class="text-gray-900">Changelog</a>
591</h2>
592        <a href="https://discourse.roots.io/tag/releases/61" class="text-sm flex items-center gap-2">View all →</a>
593      </div>
594      <div class="flex flex-col gap-4">
595                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
596            <h3 class="mb-2 font-mono text-sm flex items-center text-black">
597                              <svg class="size-4 mr-2 flex-shrink-0" width="280" height="280" viewBox="0 0 28
5970 280" xmlns="http://www.w3.org/2000/svg"><path d="M210 260h-60v-60l30-30 60 60-30 30zM95 135V95h90v40l-45 45-45-45zm35 125H70l-30-30 60-60 30 30v60zm75-130V65L140 0 75 65v65H0v85l65 65h150l65-65v-85h-75z" fill="#5361D9" fill-rule="evenodd"/></svg>                            <span class="text-brand-primary">roots/acorn v6.3.0</span>
598            </h3>
599            <div class="flex items-center gap-2">
600              <time class="sr-only">2026-09-22</time>
601              <span class="text-xs">2 days ago</span>
602            </div>
603            <a href="https://discourse.roots.io/t/acorn-v6-3-0-released/30427" class="absolute inset-0" aria-label="Read acorn v6.3.0">
604              <span class="sr-only">acorn v6.3.0</span>
605            </a>
606          </div>
607                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
608            <h3 class="mb-2 font-mono text-sm flex items-center text-black">
609                              <svg class="size-4 mr-2 flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M1.233 0L0 1.233v16.034l1.057 1.057 34.886-5.815L37 13.567v11.1l35.52-5.92 1.48-1.48V1.233L72.767 0H1.233zm.247 30.587L0 32.067v9.866l1.057 1.057L37 37V24.667l-35.52 5.92zM37 37v12.334l35.52-5.92 1.48-1.48v-9.867l-1.057-1.057L37 37zM1.48 55.253L0 56.733v16.034L1.233 74h71.534L74 72.767V56.733l-1.057-1.057-34.886 5.815L37 60.434v-11.1l-35.52 5.92z" fill="#525DDC"/></svg>                            <span class="text-brand-primary">roots/bedrock 1.31.6</span>
610            </h3>
611            <div class="flex items-center gap-2">
612              <time class="sr-only">2026-09-22</time>
613              <span class="text-xs">2 days ago</span>
614            </div>
615            <a href="https://discourse.roots.io/t/bedrock-1-31-6-released/30426" class="absolute inset-0" aria-label="Read bedrock 1.31.6">
616              <span class="sr-only">bedrock 1.31.6</span>
617            </a>
618          </div>
619                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
620            <h3 class="mb-2 font-mono text-sm flex items-center text-black">
621                              <svg class="size-4 mr-2 flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M1.233 0L0 1.233v16.034l1.057 1.057 34.886-5.815L37 13.567v11.1l35.52-5.92 1.48-1.48V1.233L72.767 0H1.233zm.247 30.587L0 32.067v9.866l1.057 1.057L37 37V24.667l-35.52 5.92zM37 37v12.334l35.52-5.92 1.48-1.48v-9.867l-1.057-1.057L37 37zM1.48 55.253L0 56.733v16.034L1.233 74h71.534L74 72.767V56.733l-1.057-1.057-34.886 5.815L37 60.434v-11.1l-35.52 5.92z" fill="#525DDC"/></svg>                            <span class="text-brand-primary">roots/bedrock 1.31.5</span>
622            </h3>
623            <div class="flex items-center gap-2">
624              <time class="sr-only">2026-09-17</time>
625              <span class="text-xs">6 days ago</span>
626            </div>
627            <a href="https://discourse.roots.io/t/bedrock-1-31-5-released/30425" class="absolute inset-0" aria-label="Read bedrock 1.31.5">
628              <span class="sr-only">bedrock 1.31.5</span>
629            </a>
630          </div>
631                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
632            <h3 class="mb-2 font-mono text-sm flex items-center text-black">
633                              <svg class="size-4 mr-2 flex-shrink-0" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M1.233 0L0 1.233v16.034l1.057 1.057 34.886-5.815L37 13.567v11.1l35.52-5.92 1.48-1.48V1.233L72.767 0H1.233zm.247 30.587L0 32.067v9.866l1.057 1.057L37 37V24.667l-35.52 5.92zM37 37v12.334l35.52-5.92 1.48-1.48v-9.867l-1.057-1.057L37 37zM1.48 55.253L0 56.733v16.034L1.233 74h71.534L74 72.767V56.733l-1.057-1.057-34.886 5.815L37 60.434v-11.1l-35.52 5.92z" fill="#525DDC"/></svg>                            <span class="text-brand-primary">roots/bedrock 1.31.4</span>
634            </h3>
635            <div class="flex items-center gap-2">
636              <time class="sr-only">2026-08-20</time>
637              <span class="text-xs">35 days ago</span>
638            </div>
639            <a href="https://discourse.roots.io/t/bedrock-1-31-4-released/30417" class="absolute inset-0" aria-label="Read bedrock 1.31.4">
640              <span class="sr-only">bedrock 1.31.4</span>
641            </a>
642          </div>
643              </div>
644    </div>
645
646    <div>
647      <div class="flex justify-between items-center mb-5">
648        <h2
649    class="mb-6 text-2xl font-bold tracking-tight md:text-3xl lg:text-3xl !mb-0"
650>
651    <a href="/blog/" class="text-gray-900">Blog</a>
652</h2>
653        <a href="/blog/" class="text-sm flex items-center gap-2">View all <svg class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
654  <path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3"/>
655</svg></a>
656      </div>
657      <div class="flex flex-col gap-4">
658                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
659            <h3 class="text-black font-bold">
660              WP Packages Now Tracks Mass Plugin Closures
661            </h3>
662            <p class="mt-2 text-sm">A public history of vendor mass&#x2d;closure events on WordPress.org — recorded automatically when 2+ plugins from the same vendor are closed within a day.</p>
663            <time class="sr-only">2026-05-10</time>
664            <a href="https://roots.io/wp-packages-now-tracks-mass-plugin-closures/" class="absolute inset-0" aria-label="Read WP Packages Now Tracks Mass Plugin Closures">
665              <span class="sr-only">Read WP Packages Now Tracks Mass Plugin Closures</span>
666            </a>
667          </div>
668                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
669            <h3 class="text-black font-bold">
670              WooCommerce Telemetry: What&#039;s Collected, What&#039;s Default, and How to Turn It Off
671            </h3>
672            <p class="mt-2 text-sm">What WooCommerce's usage tracker sends to tracking.woocommerce.com, when it turns itself on, and how to stop it.</p>
673            <time class="sr-only">2026-04-24</time>
674            <a href="https://roots.io/disable-woocommerce-telemetry/" class="absolute inset-0" aria-label="Read WooCommerce Telemetry: What&#039;s Collected, What&#039;s Default, and How to Turn It Off">
675              <span class="sr-only">Read WooCommerce Telemetry: What&#039;s Collected, What&#039;s Default, and How to Turn It Off</span>
676            </a>
677          </div>
678                  <div class="p-6 border rounded-md border-brand-lighter relative hover:border-brand-primary transition-colors">
679            <h3 class="text-black font-bold">
680              Serve Your WordPress Posts as Markdown
681            </h3>
682            <p class="mt-2 text-sm">A WordPress plugin that serves posts and feeds as Markdown for AI agents, with spec&#x2d;correct content negotiation and .md URL support.</p>
683            <time class="sr-only">2026-04-20</time>
684            <a href="https://roots.io/serve-your-wordpress-posts-as-markdown/" class="absolute inset-0" aria-label="Read Serve Your WordPress Posts as Markdown">
685              <span class="sr-only">Read Serve Your WordPress Posts as Markdown</span>
686            </a>
687          </div>
688              </div>
689    </div>
690  </div>
691
692  <div class="max-w-6xl mx-auto px-4 w-full mt-4 md:mt-0">
693    <div class="mb-10">
694      <h2
695    class="mb-6 text-2xl font-bold tracking-tight md:text-3xl lg:text-3xl text-center"
696>
697    Sponsors
698</h2>
699
700
701<ul class="flex flex-wrap justify-center gap-4 mb-8 max-w-3xl mx-auto">
702      <li>
703      <a href="https://carrot.com/" rel="sponsored">
704        <img src="https://roots.io/build/assets/carrot-U-3tnBjH.svg" alt="Carrot" class="w-auto !h-24 rounded-lg aspect-[16/12]" lazy>
705      </a>
706    </li>
707      <li>
708      <a href="https://wordpress.com/" rel="sponsored">
709        <img src="https://roots.io/build/assets/wordpress-com-COwyg-kV.svg" alt="WordPress.com" class="w-auto !h-24 rounded-lg aspect-[16/12]" lazy>
710      </a>
711    </li>
712      <li>
713      <a href="https://www.itineris.co.uk/" rel="sponsored">
714        <img src="https://roots.io/build/assets/itineris-B1enfPfI.svg" alt="Itineris" class="w-auto !h-24 rounded-lg aspect-[16/12]" lazy>
715      </a>
716    </li>
717      <li>
718      <a href="https://kinsta.com/?kaid=OFDHAJIXUDIV" rel="sponsored">
719        <img src="https://roots.io/build/assets/kinsta-wOzVJCcU.svg" alt="Kinsta" class="w-auto !h-24 rounded-lg aspect-[16/12]" lazy>
720      </a>
721    </li>
722  
723  </ul>
724
725<p class="text-lg text-center">Roots is an independent open source org, supported only by developers like you. <a href="/sponsors/" class="hover:text-brand-700">Become a sponsor</a>.</p>
726    </div>
727    <div class="mb-10">
728      <h2
729    class="mb-6 text-2xl font-bold tracking-tight md:text-3xl lg:text-3xl text-center"
730>
731    Brands that trust us
732</h2>
733
734<div class="grid items-center grid-cols-4 gap-2 md:grid-cols-6 auto-rows-fr">
735  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
736    <svg class="w-auto h-24 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>NASA</title><path d="M4.344 13.598c.075.281.195.39.407.39.22 0 .335-.132.335-.39V8.804h1.379v4.794c0 .675-.088.968-.43 1.31-.247.248-.703.439-1.278.439-.464 0-.909-.154-1.192-.438-.249-.25-.386-.505-.599-1.311l-.846-3.196c-.074-.281-.194-.39-.406-.39-.22 0-.336.132-.336.39v4.794H0v-4.794c0-.675.088-.968.43-1.31.247-.248.703-.439 1.278-.439.464 0 .909.154 1.192.438.249.25.385.505.599 1.311zM22.575 15.196l-1.591-4.98a.415.415 0 00-.06-.132.226.226 0 00-.186-.082.226.226 0 00-.185.082.414.414 0 00-.06.132l-1.591 4.98h-1.425l1.739-5.44c.09-.283.22-.524.384-.684.282-.275.614-.419 1.138-.419.525 0 .857.144 1.139.42.164.16.294.4.384.683L24 15.196h-1.425zM15.531 15.196c.903 0 1.344-.192 1.692-.538.385-.383.569-.802.569-1.427 0-.553-.202-1.064-.51-1.37-.403-.4-.903-.527-1.719-.527h-1.142c-.436 0-.61-.053-.748-.188-.094-.093-.139-.23-.139-.393 0-.168.04-.334.156-.448.103-.1.243-.147.511-.147h3.301V8.804h-3.049c-.903 0-1.343.192-1.691.538-.385.383-.57.802-.57 1.427 0 .553.203 1.064.51 1.37.404.4.904.527 1.72.527h1.141c.437 0 .61.053.748.188.095.093.14.23.14.393 0 .169-.041.335-.157.448-.102.1-.242.147-.51.147h-3.405l-1.306-4.086c-.09-.283-.22-.524-.384-.684-.282-.275-.615-.419-1.139-.419s-.857.144-1.138.42c-.165.16-.294.4-.385.683l-1.738 5.44h1.424l1.592-4.98a.415.415 0 01.06-.132.226.226 0 01.185-.082c.082 0 .142.028.186.082a.413.413 0 01.06.132l1.591 4.98h4.144z"/></svg>  </div>
737  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
738    <svg alt="Mercedes" class="w-auto max-w-full h-12" class="w-auto h-12 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>Mercedes</title><path d="M12 0c6.623 0 12 5.377 12 12s-5.377 12-12 12S0 18.623 0 12 5.377 0 12 0zM3.245 17.539A10.357 10.357 0 0012 22.36c3.681 0 6.917-1.924 8.755-4.821L12 14.203zm10.663-6.641l7.267 5.915A10.306 10.306 0 0022.36 12c0-5.577-4.417-10.131-9.94-10.352zm-2.328-9.25C6.057 1.869 1.64 6.423 1.64 12c0 1.737.428 3.374 1.185 4.813l7.267-5.915z"></path></svg>  </div>
739  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
740    <svg class="w-auto h-12 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>Docker</title><path d="M13.983 11.078h2.119a.186.186 0 00.186-.185V9.006a.186.186 0 00-.186-.186h-2.119a.185.185 0 00-.185.185v1.888c0 .102.083.185.185.185m-2.954-5.43h2.118a.186.186 0 00.186-.186V3.574a.186.186 0 00-.186-.185h-2.118a.185.185 0 00-.185.185v1.888c0 .102.082.185.185.185m0 2.716h2.118a.187.187 0 00.186-.186V6.29a.186.186 0 00-.186-.185h-2.118a.185.185 0 00-.185.185v1.887c0 .102.082.185.185.186m-2.93 0h2.12a.186.186 0 00.184-.186V6.29a.185.185 0 00-.185-.185H8.1a.185.185 0 00-.185.185v1.887c0 .102.083.185.185.186m-2.964 0h2.119a.186.186 0 00.185-.186V6.29a.185.185 0 00-.185-.185H5.136a.186.186 0 00-.186.185v1.887c0 .102.084.185.186.186m5.893 2.715h2.118a.186.186 0 00.186-.185V9.006a.186.186 0 00-.186-.186h-2.118a.185.185 0 00-.185.185v1.888c0 .102.082.185.185.185m-2.93 0h2.12a.185.185 0 00.184-.185V9.006a.185.185 0 00-.184-.186h-2.12a.185.185 0 00-.184.185v1.888c0 .102.083.185.185.185m-2.964 0h2.119a.185.185 0 00.185-.185V9.006a.185.185 0 00-.184-.186h-2.12a.186.186 0 00-.186.186v1.887c0 .102.084.185.186.185m-2.92 0h2.12a.185.185 0 00.184-.185V9.006a.185.185 0 00-.184-.186h-2.12a.185.185 0 00-.184.185v1.888c0 .102.082.185.185.185M23.763 9.89c-.065-.051-.672-.51-1.954-.51-.338.001-.676.03-1.01.087-.248-1.7-1.653-2.53-1.716-2.566l-.344-.199-.226.327c-.284.438-.49.922-.612 1.43-.23.97-.09 1.882.403 2.661-.595.332-1.55.413-1.744.42H.751a.751.751 0 00-.75.748 11.376 11.376 0 00.692 4.062c.545 1.428 1.355 2.48 2.41 3.124 1.18.723 3.1 1.137 5.275 1.137.983.003 1.963-.086 2.93-.266a12.248 12.248 0 003.823-1.389c.98-.567 1.86-1.288 2.61-2.136 1.252-1.418 1.998-2.997 2.553-4.4h.221c1.372 0 2.215-.549 2.68-1.009.309-.293.55-.65.707-1.046l.098-.288Z"/></svg>  </div>
741  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
742    <svg alt="Hulu" class="w-auto h-20 max-w-full" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M14.707 15.957h1.912V8.043h-1.912zm-3.357-2.256a.517.517 0 0 1-.512.511H9.727a.517.517 0 0 1-.512-.511v-3.19H7.303v3.345c0 1.368.879 2.09 2.168 2.09h1.868c1.189 0 1.912-.856 1.912-2.09V10.51h-1.912c.01 0 .01 3.09.01 3.19zm10.75-3.19v3.19a.517.517 0 0 1-.512.511h-1.112a.517.517 0 0 1-.511-.511v-3.19h-1.912v3.345c0 1.368.878 2.09 2.167 2.09h1.868c1.19 0 1.912-.856 1.912-2.09V10.51zm-18.32 0H2.557c-.434 0-.645.11-.645.11V8.044H0v7.903h1.9v-3.179c0-.278.234-.511.512-.511h1.112c.278 0 .511.233.511.511v3.19h1.912v-3.446c0-1.445-.967-2-2.167-2Z"/></svg>  </div>
743  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
744    <svg class="w-auto h-16 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>HBO</title><path d="M7.042 16.896H4.414v-3.754H2.708v3.754H.01L0 7.22h2.708v3.6h1.706v-3.6h2.628zm12.043.046C21.795 16.94 24 14.689 24 11.978a4.89 4.89 0 0 0-4.915-4.92c-2.707-.002-4.09 1.991-4.432 2.795.003-1.207-1.187-2.632-2.58-2.634H7.59v9.674l4.181.001c1.686 0 2.886-1.46 2.888-2.713.385.788 1.72 2.762 4.427 2.76zm-7.665-3.936c.387 0 .692.382.692.817 0 .435-.305.817-.692.817h-1.33v-1.634zm.005-3.633c.387 0 .692.382.692.817 0 .436-.305.818-.692.818h-1.33V9.373zm1.77 2.607c.305-.039.813-.387.992-.61-.063.276-.068 1.074.006 1.35-.204-.314-.688-.701-.998-.74zm3.43 0a2.462 2.462 0 1 1 4.924 0 2.462 2.462 0 0 1-4.925 0zm2.462 1.936a1.936 1.936 0 1 0 0-3.872 1.936 1.936 0 0 0 0 3.872Z"/></svg>  </div>
745  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
746    <svg alt="Goodwill" class="w-auto max-w-full h-12" viewBox="0 0 117 152" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path id="a" d="M0 0h116.359v152H0z"/></defs><g fill="none" fill-rule="evenodd"><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><path fill="#232020" fill-rule="nonzero" mask="url(#b)" d="M116.359 151.188H.668V0h115.691v151.188"/><path d="M108.473 7.89H62.426v50.294c.008 22.222-17.942 40.18-40.09 40.18l-13.781-.009v14.707h99.918V7.891" fill="#FFF" fill-rule="nonzero"/><path d="M8.55 90.469h13.59l.169-.012c17.78 0 32.207-14.43 32.207-32.219l-.012-50.355H8.55v57.074l.472.023h4.704c6.113-.003 11.48-2.8 14.972-7.164l6.7 4.086c-4.848 6.664-12.712 10.95-21.587 10.95H8.665l-.113.015V90.47" fill="#FFF" fill-rule="nonzero"/><path d="M21.227 32.434c0-5.657 4.574-10.23 10.226-10.23 5.64 0 10.227 4.573 10.227 10.23 0 5.644-4.586 10.218-10.227 10.218-5.652 0-10.226-4.574-10.226-10.218" fill="#232020" fill-rule="nonzero"/><path d="M39.953 124.527h10.883c.492 0 .894.317.894.707v10.329c0 .398-.402.718-.894.718H39.953c-.492 0-.894-.32-.894-.719v-10.328c0-.39.402-.707.894-.707m3.734 5.59c0 1.063.864 1.922 1.915 1.922 1.066 0 1.918-.86 1.918-1.922 0-1.058-.852-1.93-1.918-1.93a1.93 1.93 0 0 0-1.914 1.93M24.445 124.527h10.88c.487 0 .894.317.894.707v10.329c0 .398-.407.718-.895.718H24.445c-.496 0-.902-.32-.902-.719v-10.328c0-.39.406-.707.902-.707m3.727 5.59c0 1.063.863 1.922 1.922 1.922a1.91 1.91 0 0 0 1.91-1.922 1.92 1.92 0 0 0-1.91-1.93 1.932 1.932 0 0 0-1.922 1.93M20.277 136.867c0 4.293-4.394 7.399-7.07 7.617-4.121.348-4.293.164-4.293.164a.649.649 0 0 1-.648-.644v-3.438a.65.65 0 0 1 .648-.652l1.742.008c1.703 0 3.082-.602 3.996-1.906.188-.22.25-.391.25-.578a.93.93 0 0 0-.925-.926.975.975 0 0 0-.586.21l-.125.126c-.73.808-1.676 1.265-2.852 1.265l-.453.008H8.914a.651.651 0 0 1-.648-.644V125.14c0-.352.293-.645.648-.645h10.711a.64.64 0 0 1 .633.645v10.546l.02 1.18Zm-6.039-8.312a1.929 1.929 0 0 0-1.922 1.925c0 1.06.864 1.918 1.922 1.918a1.923 1.923 0 0 0 0-3.844M74.992 132.04h.801a.717.717 0 0 0 .723-.716v-6.082c0-.398.316-.715.703-.715h2.77c.39 0 .722.317.722.715v6.082c0 .399.309.715.707.715h.797a.711.711 0 0 0 .71-.621v-6.176c0-.398.325-.715.716-.715h2.808c.399 0 .723.317.723.715v10.324a.713.713 0 0 1-.723.707h-2.808a.564.564 0 0 1-.184-.023l-3.309.008a.742.742 0 0 1-.16.015h-2.77c-.038 0-.081 0-.124-.007l-3.442.004-2.406.003h-.488a.714.714 0 0 1-.715-.707v
746-10.324c0-.398.328-.715.715-.715h2.812c.39 0 .715.317.715.715v6.082c0 .399.317.715.707.715m-1.34 4.23-2.406.004h2.324l.082-.003Zm9.274-4.851.008-.094v-1.304l-.008-4.778v6.176M63.691 118.902h2.797c.403 0 .719.32.719.723v15.938a.72.72 0 0 1-.719.718H55.2a.725.725 0 0 1-.722-.719v-10.32c0-.39.324-.722.722-.722h7.063a.71.71 0 0 0 .71-.602v-4.293c0-.402.317-.723.72-.723m-.72 11.391c.012-.059.012-.113.012-.18 0-.062 0-.12-.011-.18a1.929 1.929 0 0 0-3.848.18c0 1.063.871 1.93 1.926 1.93 1.011 0 1.832-.77 1.922-1.75M90.719 118.902h2.808c.391 0 .72.32.72.723v3.09c0 .394-.329.71-.72.71H90.72a.704.704 0 0 1-.703-.71v-3.09a.71.71 0 0 1 .703-.723M90.719 124.527h2.808c.391 0 .72.317.72.707v10.329a.722.722 0 0 1-.72.718H90.72a.709.709 0 0 1-.703-.719v-10.328c0-.39.312-.707.703-.707M97.809 118.902h2.75c.398 0 .722.32.722.723v15.938c0 .39-.324.718-.722.718h-2.75a.72.72 0 0 1-.723-.719v-15.937c0-.402.316-.723.723-.723M104.836 118.902h2.762c.398 0 .715.32.715.723v15.938c0 .39-.317.718-.715.718h-2.762a.725.725 0 0 1-.723-.719v-15.937c0-.402.325-.723.723-.723" fill="#FFF" fill-rule="nonzero"/></g></svg>  </div>
747  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
748    <svg alt="US Government" class="w-auto max-w-full h-12" class="w-auto h-12" xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 72 56" fill="currentColor"><path d="M8 8v40.1h56V8Zm20.58 4.9.74-1.49.73 1.49 1.65.24-1.19 1.17.28 1.69-1.47-.78-1.48.78.28-1.64-1.19-1.17Zm2.21 13.72-1.47-.77-1.48.77.28-1.62-1.19-1.17 1.65-.23.74-1.5.73 1.5 1.65.23L30.51 25Zm-5.28-9.8.74 1.49 1.65.24-1.19 1.17.29 1.64-1.48-.78-1.52.78.28-1.64-1.19-1.17 1.65-.24Zm-2.6 9.8-1.47-.77-1.44.77.24-1.62-1.19-1.17 1.65-.23.74-1.5.73 1.5 1.65.23L22.63 25ZM20.7 12.9l.74-1.49.73 1.49 1.65.24-1.19 1.17.28 1.69-1.47-.78L20 16l.28-1.64-1.19-1.17Zm-3.45 3.92.75 1.49 1.65.24-1.19 1.17.28 1.64-1.48-.78-1.47.78.28-1.64-1.2-1.17 1.65-.24Zm-4.14-3.92.74-1.49.74 1.49 1.65.24L15 14.31l.33 1.69-1.48-.78-1.47.78.28-1.64-1.2-1.17Zm0 10.68.74-1.5.74 1.5 1.65.23L15 25l.29 1.64-1.48-.77-1.48.77.33-1.64-1.2-1.17Zm48 21.94L11 45.57v-3.7h50.08Zm0-6.19H11v-3.64h50.08Zm0-5.85H11v-3.64h50.08Zm0-6.5H35.5v-3.64h25.58Zm0-6.59H35.5v-3.65h25.58Zm0-6.21H35.5v-3.65h25.58Z"/></svg>  </div>
749  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
750    <svg alt="Amnesty International" class="w-auto h-12 max-w-full" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 142 59"><path d="m3 35.5 3.9-21.3h4.5l3.8 21.3h-3.5l-.6-4.6h-4l-.7 4.6H3zm4.7-7.9h2.9l-1.5-9.9-1.4 9.9zm9.4 7.9V14.2h4.7l2.4 11.3c.1.4.2 1.1.3 1.9.1.8.2 1.8.2 2.9 0-1.1.1-2 .1-2.9.1-.8.2-1.5.3-2l2.5-11.2h4.7v21.3H29V21.7c0-.2 0-.6.1-1.4 0-.8.1-1.8.2-3.2-.1.5-.2 1.1-.3 1.7-.1.7-.3 1.6-.5 2.7l-2.8 13.9h-1.8l-2.8-13.9c-.2-1.1-.4-2.1-.5-2.7-.1-.7-.2-1.2-.3-1.7.1 1.4.2 2.4.2 3.2 0 .8.1 1.2.1 1.4v13.8h-3.5zm17.6 0V14.2H38l4.1 11.4c.2.5.3 1 .5 1.7s.3 1.4.5 2.2h.1c-.2-.9-.3-1.7-.3-2.4-.1-.7-.1-1.4-.1-1.9v-11h3.1v21.3h-3l-4.4-12.3c-.2-.6-.4-1.3-.6-1.9-.2-.6-.3-1.3-.4-1.9h-.1c.2.8.3 1.6.4 2.3.1.8.1 1.6.1 2.5v11.2l-3.2.1zm13.8 0V14.2h9.8v3.3H52v5.3h4.8v3.4H52v5.9h6.6v3.4H48.5zM60.1 30l3.3-.5c.2 1.1.5 1.9.9 2.4s.9.8 1.5.8 1.1-.2 1.5-.6c.4-.4.6-.9.6-1.5 0-1.1-1.3-2.8-3.8-5.1-.4-.4-.7-.6-.9-.8-.8-.8-1.5-1.6-2-2.6s-.7-1.9-.7-3c0-1.5.5-2.8 1.5-3.8s2.3-1.5 3.8-1.5 2.6.4 3.5 1.3c.9.9 1.4 2.1 1.7 3.7l-3.2.5c-.1-.8-.3-1.5-.7-1.9-.4-.4-.8-.7-1.3-.7-.6 0-1 .2-1.4.6-.3.4-.5.9-.5 1.5s.2 1.1.5 1.6 1 1.3 2.1 2.3c.2.1.4.4.7.6 2.8 2.5 4.2 4.8 4.2 6.9 0 1.6-.5 2.9-1.5 3.9s-2.3 1.5-4 1.5c-1.6 0-2.9-.5-3.9-1.6-1.1-.7-1.7-2.2-1.9-4zm16 5.5V17.4h-3.5v-3.2h10.6v3.2h-3.5v18.1h-3.6zm13.8 0v-8.9l-4.2-12.5h3.6l2 6.7c.1.3.2.7.3 1.2.1.5.1 1.1.2 1.7.1-.7.1-1.3.2-1.9.1-.5.1-.9.2-1.1l2-6.6h3.5l-4.2 12.5v8.9h-3.6zM2.5 54.3V41.5h2.1v12.8H2.5zm4.4 0V41.5h2l2.5 6.8c.1.3.2.6.3 1s.2.8.3 1.3c-.1-.5-.2-1-.2-1.5 0-.4-.1-.8-.1-1.1v-6.6h1.9v12.8h-1.8L9.1 47c-.1-.4-.3-.8-.4-1.1-.1-.4-.2-.8-.2-1.1.1.5.2.9.2 1.4s.1 1 .1 1.5v6.8H6.9v-.2zm10.1 0V43.5h-2.1v-1.9h6.4v1.9h-2.1v10.9H17v-.1zm5.7 0V41.5h5.9v2h-3.7v3.2h2.9v2h-2.9v3.6h4v2h-6.2zm14.7 0h-2.2L33.6 49h-1.2v5.3h-2.2V41.5H33c.8 0 1.4.1 1.9.2.4.1.8.3 1.1.5.4.3.7.7.9 1.3.2.5.3 1.1.3 1.8 0 .8-.1 1.5-.4 2-.3.6-.7 1-1.3 1.4l1.9 5.6zm-5-7h.5c.8 0 1.4-.2 1.7-.5s.5-.9.5-1.6c0-.7-.2-1.2-.5-1.5s-.9-.5-1.6-.5h-.7l.1 4.1zm6.8 7V41.5h2l2.5 6.8c.1.3.2.6.3 1s.2.8.3 1.3h.1c-.1-.5-.2-1-.2-1.5 0-.4-.1-.8-.1-1.1v-6.6H46v12.8h-1.8L41.5 47c-.1-.4-.3-.8-.4-1.1-.1-.4-.2-.8-.2-1.1h-.1c.1.5.2.9.2 1.4s.1 1 .1 1.5v6.8h-1.9v-.2zm8 0 2.3-12.8h2.7l2.3 12.8h-2.1l-.4-2.7h-2.4l-.4 2.8-2-.1zm2.8-4.7h1.7l-.9-6-.8 6zm6.5 4.7V43.5h-2.1v-1.9h6.4v1.9h-2.1v10.9h-2.2v-.1zm5.7 0V41.5h2.1v12.8h-2.1zm3.9-6.4c0-2.2.3-3.8 1-5 .6-1.1 1.6-1.7 2.8-1.7 1.2 0 2.2.6 2.8 1.7.6 1.1 1 2.8 1 5s-.3 3.9-1 5c-.6 1.1-1.6 1.7-2.8 1.7-1.2 0-2.2-.6-2.8-1.7-.7-1.1-1-2.8-1-5zm2.1 0c0 1.6.1 2.8.4 3.6s.7 1.2 1.2 1.2c.6 0 1-.4 1.2-1.2.3-.8.4-2 .4-3.6s-.1-2.8-.4-3.6-.7-1.2-1.2-1.2c-.6 0-1 .4-1.2 1.2-.2.8-.4 2-.4 3.6zm7.2 6.4V41.5h2l2.5 6.8c.1.3.2.6.3 1 .1.4.2.8.3 1.3h.1c-.1-.5-.2-1-.2-1.5 0-.4-.1-.8-.1-1.1v-6.6h1.9v12.8h-1.8L77.6 47c-.1-.4-.3-.8-.4-1.1-.1-.4-.2-.8-.2-1.1h-.1c.1.5.2.9.2 1.4s.1 1 .1 1.5v6.8h-1.8v-.2zm7.9 0 2.3-12.8h2.7l2.3 12.8h-2.1l-.4-2.8h-2.4l-.4 2.8h-2zm2.8-4.7h1.7l-.9-6-.8 6zm5.7 4.7V41.5H94v10.8h4v2h-6.2zM128.1 51.2c0 .1-.1.1 0 0 .3.2.8.1 1-.2l.6-1.2.9.8c.3.2.7.2 1 0 .3-.3.2-.7 0-1l-.4-.4c2.2-.6 3.7-1.1 4.7-1.4l-.2.6c-.1.3.1.7.4.9.3.1.7-.1.9-.4l.4-1.2 1 .7c.3.2.7.1.9-.2s.1-.7-.2-.9l-1.3-.9.6-1.5c.1-.3-.1-.7-.4-.9-.3-.1-.7.1-.9.4l-.4 1.2-.9-.6c-.3-.2-.7-.1-.9.2s-.2.7.2.9l.7.5c-.9.3-2.5.9-5 1.5l.4-.9c.2-.3 0-.7-.3-.9s-.7 0-.9.3l-.6 1.1-.8-.7c-.1-.1-.2-.1-.3-.2.1-3.1.1-6.4.2-9.6.4-.1.8-.1 1.1-.2l-.4.8c-.2.3 0 .7.3.9s.7 0 .9-.3l.6-1.2.9.8c.3.2.7.2 1-.1.2-.3.2-.7-.1-1l-.5-.5c1.2-.3 2.1-.6 2.8-.9 1.6-.7 2.4-1.7 2.5-2.8v-.3l1.1.4c.4.1.7-.
7501.9-.4.1-.4-.1-.7-.4-.9l-1.2-.4.6-.9c.2-.3.1-.7-.2-.9-.3-.2-.7-.1-.9.2l-.7 1c-.6-.8-1.5-1.4-2.3-1.9h-.1c-.6-.4-1.3-.9-2.2-1.3l.8-.6c.3-.2.4-.6.1-.9-.2-.3-.6-.4-.9-.1l-1 .7-.4-1c-.1-.4-.5-.5-.9-.4s-.5.5-.4.9l.1.4c-.2-.1-.4-.1-.6-.2.4-1.6.9-3.6.6-4.6-.2-.8-1.8-.9-1.8-.9H122c-.7-1-.4-1.2.2-2.5.6-1.4 1.4-1.9 3.3-4.1.3-.3 2.9-3.6 2.9-3.6.6-1 1-2 1-3 0-4.6-4.4-7.2-4.4-7.2s-.1 1.1-.6 2.4c-.5 1.2-3.1 2.4-5.2 3.3-1.9.8-5.3 1.2-6.3 7.1.9 6.6 5.9 6.1 6.3 6.5.3.3.1.8 0 1.1h-5.9v4.9c-2.7.6-5.2 1.4-7.1 2.2l.2-.6c.1-.4-.1-.7-.5-.8-.4-.1-.7.1-.8.5l-.4 1.2-.9-.6c-.3-.2-.7-.1-.9.2-.2.3-.1.7.2.9l.5.3c-.9.4-1.5.7-1.6.8-.3.2-.5.6-.3.9s.6.5.9.3c0 0 .5-.3 1.4-.7l-.2.8c-.1.4.1.7.5.8.4.1.7-.1.8-.5l.4-1.3 1 .6c.3.2.7.1.9-.2.2-.3.1-.7-.2-.9l-.7-.4c1.8-.7 4.2-1.5 6.8-2.1v11l-2.5.3.3-.5c.2-.3.1-.7-.3-.9-.3-.2-.7-.1-.9.3l-.6 1.1-.8-.7c-.3-.3-.7-.3-1 0s-.3.7 0 1l.4.4c-2.9.8-4.7 2.1-4.9 3.8-.1.8.1 1.7 1.1 2.8l-1.1.3c-.4.1-.6.5-.5.8.1.4.5.6.8.5l1.3-.3V48c0 .4.3.7.7.7.4 0 .7-.3.7-.7v-1c.7.4 1.6.9 2.6 1.3.6.2 1.4.5 2.2.7l-.8.7c-.3.2-.3.7-.1 1 .2.3.7.3 1 .1l1-.9.5 1.1c.2.3.6.5.9.3l.1-.1v5L128 59s.1-7.4.1-7.8zm.7-24c.2.1.5.2.7.2l-.8.6c0-.1 0-.4.1-.8zm-.2 1.9c.2.2.6.2.8.1l1.1-.8.4 1.1c.1.3.5.5.9.4s.5-.5.4-.9l-.1-.3c.6.3 1 .6 1.5.9h.1c.3.2.5.3.7.5-.1.1-.3.2-.3.4-.1.4.1.7.4.9l1.2.4-.7 1c-.2.3-.1.7.2.9h.1c-.3.2-.6.3-.9.5-.6.3-1.5.6-2.5.8l.3-.7c.2-.3 0-.7-.3-.9s-.7 0-.9.3l-.5 1.1-.8-.7c-.3-.3-.7-.2-1 .1-.2.3-.2.7.1 1l.4.4c-.3 0-.5.1-.8.1.1-2.4.1-4.7.2-6.6zm-15.1 17.2-1 .8-.4-1c-.2-.3-.6-.5-.9-.3s-.5.6-.3.9l.1.3c-.7-.2-1.2-.4-1.7-.6-.7-.3-1.3-.6-1.9-.9l.3-.1c.4-.1.6-.5.5-.8-.1-.4-.5-.6-.8-.5l-1.2.3v-1.
7501c0-.4-.3-.7-.7-.7-.4 0-.7.3-.7.7v.1c-.2-.4-.3-.8-.3-1.1.2-1.1 1.6-2 3.9-2.6l-.4.8c-.2.3-.1.7.3.9.3.2.7.1.9-.3l.6-1.2.8.8c.3.3.7.3 1 0s.3-.7 0-1l-.6-.6h.2l2.4-.3v7.5h-.1zm4.4-33c0-.2.5-1.4.5-1.6l1-1.4c.8-.8 1.7-1.6 2.5-2.3 1.7-1.6 4.2-4.4 4.2-4.4s1.5 2-1.1 6.1c-.1.2-.8 1.3-.9 1.5l-1.3 1.6c-.6.8-.9 1.1-1.2 2-.6 1.7-1.2 3.7-1.2 3.7s-2.5-1.7-2.5-5.2zm7.5 42.1c-.4-.2-9.2-2.3-9.4-2.3V38.8c.7-.1 1.3-.1 2-.2l-.4.6c-.2.3-.1.7.2.9.3.2.7.1.9-.2l.8-1.1.7.9c.2.3.7.3 1 .1s.3-.7.1-1l-.5-.7c1.6-.2 3.1-.4 4.6-.6v17.9zm0-19.1c-1.4.2-2.9.4-4.5.6l.4-.5c.2-.3.1-.7-.2-.9-.3-.2-.7-.1-.9.2l-.7 1-.7-.8c-.2-.3-.7-.3-.9-.1-.3.2-.3.7-.1 1l.4.5c-.7.1-1.4.2-2.1.2V23h9.4c-.1.2-.1 9.5-.1 13.3z"/></svg>  </div>
751  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
752    <svg class="w-auto h-18 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>Sony</title><path d="M8.5505 9.8881c.921 0 1.6574.2303 2.2209.7423.3848.3485.5999.8454.5939 1.3665a1.9081 1.9081 0 0 1-.5939 1.3726c-.5272.4848-1.3483.7423-2.221.7423-.8725 0-1.6785-.2575-2.2148-.7423-.3908-.3485-.609-.8484-.603-1.3726 0-.518.2182-1.015.603-1.3665.5-.4545 1.3847-.7423 2.2149-.7423zm.003 3.6692c.4606 0 .8878-.1606 1.1878-.4575.2999-.2999.4332-.6605.4332-1.1029 0-.4242-.1484-.821-.4333-1.1029-.2938-.2908-.7332-.4545-1.1877-.4545s-.8938.1637-1.1907.4545c-.2848.2818-.4333.6787-.4333 1.103-.006.409.1485.806.4333 1.1029.2969.2939.7332.4575 1.1907.4575zm-4.8418-1.9665c.1605.0424.315.094.4666.1636a1.352 1.352 0 0 1 .3787.2576c.197.206.309.4817.306.7665a.9643.9643 0 0 1-.3787.7788 2.0662 2.0662 0 0 1-.709.3485 3.7231 3.7231 0 0 1-1.1938.1697c-.352 0-.5467-.0406-.8138-.0962l-.077-.016c-.294-.0666-.5817-.1575-.8575-.2787a.0695.0695 0 0 0-.0424-.0121c-.0454 0-.0818.0394-.0818.0848v.203H.1212v-1.4786h.5242a.7559.7559 0 0 0 .1363.418c.2121.2607.4394.3607.6575.4395.3666.1212.7514.1848 1.1362.1969.5526 0 .8756-.134.9455-.163l.009-.0037.0062-.0023c.0616-.0226.3119-.1143.3119-.3916 0-.2743-.2338-.334-.387-.373l-.022-.0058c-.1708-.046-.562-.0872-.9897-.1323l-.1526-.016c-.4848-.0515-.9696-.1273-1.1968-.1758-.4977-.1097-.6942-.2917-.816-.4045l-.0082-.0076A1.0192 1.0192 0 0 1 0 11.1608c0-.497.3394-.797.7575-.9817.4454-.2.9756-.288 1.4392-.288.8211.0031 1.4877.2697 1.727.394.097.0515.1455-.0121.1455-.0606v-.1484h.5272v1.2876h-.4727a.9056.9056 0 0 0-.2939-.4909 1.289 1.289 0 0 0-.297-.1787c-.3968-.1667-.821-.2515-1.2513-.2455-.4423 0-.8665.085-1.0786.2153-.1333.0818-.2.1848-.2.306 0 .1727.1454.2424.2182.2636.1967.0597.6328.103.972.1369.0736.0073.1426.0142.2036.0206.3272.0334 1.012.1243 1.315.2zm18.1673-.9966v-.4787H24v.4696h-.4757c-.1727 0-.2424.0334-.3727.1788l-1.4271 1.63a.098.098 0 0 0-.0182.0698v.7423a1.106 1.106 0 0 0 .0121.103.1496.1496 0 0 0 .1.0909.9368.9368 0 0 0 .1303.009h.4848v.4698h-2.5724v-.4697h.4606a.9343.9343 0 0 0 .1302-.0091.1627.1627 0 0 0 .1031-.091.5626.5626 0 0 0 .009-.1v-.7422c0-.0242 0-.0242-.0333-.0636a606.7592 606.7592 0 0 0-1.4119-1.6028c-.0758-.0788-.2061-.2061-.406-.2061h-.4576v-.4696h2.5876v.4696h-.3121c-.0697 0-.1182.0697-.0576.1455 0 0 .8696 1.0392.8787 1.0513.0091.0122.0152.0122.0273.003.0121-.009.8938-1.0453.8999-1.0543a.0912.0912 0 0 0-.0182-.1273.1095.1095 0 0 0-.0606-.0182zm-6.284-.0031h.4848c.2212 0 .2606.0848.2636.2909l.0273 1.5664-2.5815-2.324H11.944v.4697h.412c.297 0 .3182.1636.3182.309v2.2138c.0004.1285.0009.295-.1818.295h-.506v.4667h2.1634v-.4697h-.5273c-.212 0-.2211-.097-.2242-.303v-1.8816l2.9724 2.6511h.7575l-.0394-2.9966c.003-.218.0182-.2908.2424-.2908h.4726v-.4697H15.595Z"/></svg>  </div>
753  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
754    <svg class="w-auto h-12 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>Zillow</title><path d="M12.006 0L1.086 8.627v3.868c3.386-2.013 11.219-5.13 14.763-6.015.11-.024.16.005.227.078.372.427 1.586 1.899 1.916 2.301a.128.128 0 0 1-.03.195 43.607 43.607 0 0 0-6.67 6.527c-.03.037-.006.043.012.03 2.642-1.134 8.828-2.94 11.622-3.452V8.627zm-.48 11.177c-2.136.708-8.195 3.307-10.452 4.576V24h21.852v-7.936c-2.99.506-11.902 3.16-15.959 5.246a.183.183 0 0 1-.23-.036l-2.044-2.429c-.055-.061-.062-.098.011-.208 1.574-2.3 4.789-5.899 6.833-7.418.042-.03.031-.06-.012-.042Z"/></svg>  </div>
755  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
756    <svg alt="Disney" class="w-auto max-w-full h-10" xmlns="http://www.w3.org/2000/svg" width="700" height="294.4" viewBox="0 0 700 294.423"><path d="M602.2 128.6c-11.7 2.7-42.6 4.2-42.6 4.2l-3.8 12.2s15.3-1.3 26.5-.2c0 0 3.6-.3 4 4 .2 4.4-.3 9-.3 9s-.3 2.7-4 3.4c-4.3.7-33.3 2-33.3 2L544 179s-1.7 3.6 2.2 2.6c3.6-1 34-6.8 38-6 4.2 1 9 6.8 7.6 12-1.6 6.3-32 25.7-50.4 24.4 0 0-9.7.6-17.8-12.5-7.8-12.5 2.7-36 2.7-36s-4.7-11-1.2-15c0 0 2-1.7 8-2.2l7.5-15.4s-8.5.5-13.5-5.7c-4.6-6-5-8.6-1.4-10.2 3.8-2 39-8.3 63.2-7.5 0 0 8.5-1 16 13.7 0 0 3.4 6-2.6 7.4M511 187.8c-3 7.3-11.3 15-21.3 10.3-10.2-4.8-26.3-37.6-26.3-37.6s-6-12.2-7.2-11.8c0 0-1.3-2.4-2 11-1 13.3.2 39.2-5.3 43.3-5 4-11 2.3-14.4-2.4-2.8-4.7-4-16-2.4-35.7 1.8-19.7 6.3-40.7 12-47.2 6-6.6 10.8-1.8 12.6 0 0 0 7.7 7 20.7 27.7l2.2 3.8s11.8 19.7 13 19.6c0 0 1 1 1.8.2 1.2-.3.8-6.7.8-6.7S493 141 482 105c0 0-1.6-4.6-.5-9 1-4 5.3-2 5.3-2s16.6 8 24.7 35c8 27 2.6 51.5-.4 58.8m-81.5-69.3c-1.6 2.8-2.3 6.7-9.2 7.8 0 0-67 4.7-70.3 9.4 0 0-2.2 2.8 1.4 3.5 3.8.8 19 2.8 26.2 3.2 7.8 0 34 .2 43.6 12 0 0 5.5 5.6 5.3 18.3-.2 13-2.5 17.6-7.6 22.3-5.3 4.4-50.7 24.8-80-6.4 0 0-13.4-15 4.7-26.4 0 0 13-8 46.3 1.3 0 0 10 3.6 9.6 7.3-.6 4-8.3 8-19.5 7.8-10.8-.3-18.8-5.5-17.2-4.6 1.5.5-11.7-6.4-15.8-1.7-4 4.4-3 7 1 9.7 10 5.8 49.3 3.7 61-9.4 0 0 4.7-5.3-2.4-9.6-7-4-27.4-6.5-35.3-6.8-7.5-.4-35.6 0-39.8-7.3 0 0-4-5.2.4-19.4 4.6-15 37.3-20.8 51.5-22 0 0 39-1.6 46.3 6.4 0 0 1 1.8-.2 4.5m-110.6 88c-4.7 3.5-14.7 2-17.6-2-2.8-3.5-3.8-17.3-3.3-39 .7-22.2 1-49.4 6-53.8 5-4.3 8-.5 10 2.4 2 3 4.6 6.3 5 13.2.6 7 2.3 43 2.3 43s2.2 32.8-2.3 36.2m9.9-117c-13.8 4.7-23.2 3.2-31.2-.3-3.5 6.3-5.6 8.2-8.2 8.6-4 .4-7.5-6-8-8-.8-1.5-2.7-4.2-.4-10.3-7.8-7-8.4-16.4-7-22.7 1.8-7.4 15-35.2 55-38.5 0 0 19.6-1.4 23 9h.6s19 0 18.6 17c0 17-21 38.2-42.4 45.5M346.8 41c-12.6 2-32 18.8-41.3 32.7 14.3 2.6 39.3 1.6 50.5-21 0 0 5.3-14.2-9.2-11.7m-55.3 11c-4 6.5-4.2 10.4-2.3 13 4.7-7 13-18 25.5-26.6-9.6 1-17.7 5-23.2 13.6m340.7 153.7c-9.2 22.6-17 45.5-21.5 79.8 0 0-1 6.7-6.5 4.5-5.5-2-14.5-11-16.5-23.7-2-16.6 5.4-44.6 20.5-76.8-4.4-7-7.5-17.4-5-32 0 0 4-27 31-51.4 0 0 3.2-2.7 5-1.8 2.2 1 1.3 9.6-.5 14-1.6 4.2-13.6 25-13.6 25s-7.5 14.2-5.4 25.3c14.2-21.8 46.5-66 66.5-52 12.7 9 12.7 38 3.2 54.8-7.5 13.3-28.7 40.8-57 34.4m41.6-68c-7.4 8-20.6 23.2-31 43.8 11-1.2 21.7-7.3 25-10.4 5.3-4.7 17.5-17.4 15.6-34.2 0 0-1.2-8.8-9.6.8m-448 79.7c-35.4 10.8-68.8 5.8-87 1-.5 7.4-1.3 10.5-2.5 11.7-1.4 1.6-13 8.2-19.4-1.2-2.8-4.5-4.2-12.6-5-20-41-18.6-60-46-60.6-47-1-1-10.3-10.7-1-22.7 8.7-10.8 37.5-21.7 63.3-26 1-22 3.4-39 6.5-46.5 3.7-9 8.4-1 12.6 5 3.4 4.5 5.5 23.8 5.7 39.2 16.8-.8 27 .4 45.7 4 24.6 4.2 41 16.8 39.7 31-1.2 14-14 19.8-19 20.2-5 .4-13-3.3-13-3.3-5.6-2.6-.5-5 6-7.8 7.2-3.5 5.6-7 5.6-7-2.6-8-34.5-13.3-66.2-13.3 0 17.5.7 46.5 1.2 63.4 22.2 4.2 38.8 3.3 38.8 3.3s81-2.3 83.3-54c2.5-51.8-81-101.4-142.5-117C56.8 14.4 22 25.8 19 27.3c-3.3 1.6-.3 2.2-.3 2.2S22 30 28 32c6 2 1.2 5 1.2 5C18.7 40.6 7 38.5 4.7 33.7c-2.3-4.7 1.5-9 6-15.3 4.2-6.5 9-6.3 9-6.3 76-26.5 168.8 21 168.8 21 86.8 43.8 101.6 95.3 100 115.3-1.4 19.7-9 53-62.5 69.2M59 146c-8.6 4-2.6 10.4-2.6 10.4 16.2 17.3 36 28.2 55 35 2.2-30 2-40.7 2-55.8C84 137.6 67 142.4 59 146"/></svg>  </div>
757  <div class="border border-brand-lighter rounded-md px-2 py-1 w-full h-full flex items-center justify-center">
758    <svg class="w-auto h-16 max-w-full" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>Toyota</title><path d="M12 3.848C5.223 3.848 0 7.298 0 12c0 4.702 5.224 8.152 12 8.152S24 16.702 24 12c0-4.702-5.223-8.152-12-8.152zm7.334 3.839c0 1.08-1.725 1.913-4.488 2.246-.26-2.58-1.005-4.279-1.963-4.913 2.948.184 6.45 1.227 6.45 2.667zM12 16.401c-.96 0-1.746-1.5-1.808-4.389.577.047 1.18.072 1.808.072.628 0 1.23-.025 1.807-.072-.061 2.89-.847 4.389-1.807 4.389zm0-6.308c-.59 0-1.155-.019-1.69-.054.261-1.728.92-3.15 1.69-3.15.77 0 1.428 1.422 1.689 3.15-.535.034-1.099.054-1.689.054zm-.882-5.075c-.956.633-1.706 2.333-1.964 4.915C6.391 9.6 4.665 8.767 4.665 7.687c0-1.44 3.504-2.49 6.453-2.669zM2.037 11.68a5.265 5.265 0 011.048-3.164c.27 1.547 2.522 2.881 5.972 3.37V12c0 3.772.879 6.203 2.087 6.97-5.107-.321-9.107-3.48-9.107-7.29zm10.823 7.29c1.207-.767 2.087-3.198 2.087-6.97v-.115c3.447-.488 5.704-1.826 5.972-3.37a5.26 5.26 0 011.049 3.165c-.004 3.81-4.008 6.969-9.109 7.29z"/></svg>  </div>
759</div>
760    </div>
761    <div class="mb-10">
762      <h2
763    class="mb-6 text-2xl font-bold tracking-tight md:text-3xl lg:text-3xl text-center"
764>
765    Recommendations
766</h2>
767
768<div class="grid gap-4 my-8 md:grid-cols-2 lg:grid-cols-3 md:gap-6 lg:gap-8 lg:grid-flow-row-dense">
769      <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter">
770  <p class="mb-3">I&#039;m a big fan of Bedrock (and all of Roots in general)</p>
771  <footer class="flex items-center mt-auto text-sm">
772    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/josh-koenig-UZlxThhu.jpg" alt="Josh Koenig" loading="lazy">
773    Josh Koenig
774  </footer>
775</blockquote>
776    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter">
777  <p class="mb-3">Bedrock is like the bridge between WordPress and the rest of PHP</p>
778  <footer class="flex items-center mt-auto text-sm">
779    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/carl-alexander-Dt_iLlr2.jpg" alt="Carl Alexander" loading="lazy">
780    Carl Alexander
781  </footer>
782</blockquote>
783    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter">
784  <p class="mb-3">In my opinion, the roots.io toolkit is the most sane way to do WordPress in 2023</p>
785  <footer class="flex items-center mt-auto text-sm">
786    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/andrew-halliwell-Cg7WRrLV.jpg" alt="Andrew Halliwell" loading="lazy">
787    Andrew Halliwell
788  </footer>
789</blockquote>
790    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter">
791  <p class="mb-3">Roots&#039; distros have been essential to jumping back into WordPress devel after a decade out. Until WP quits being an antiquated, monetized pit of code, this is all that’s holding my sanity in check.</p>
792  <footer class="flex items-center mt-auto text-sm">
793    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/ross-j-kuhn-BUo8GxT0.jpg" alt="Ross J Kuhn" loading="lazy">
794    Ross J Kuhn
795  </footer>
796</blockquote>
797    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter lg:col-span-2">
798  <p class="mb-3">Bedrock is doing a huge service to the WordPress community, and I can see it being adopted as the standard for WordPress development. Hopefully as more people adopt it, the developer community at large will view WordPress sites on similar footing as more “professional” platforms.</p>
799  <footer class="flex items-center mt-auto text-sm">
800    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/daniel-strunk-CbrBRn_R.jpg" alt="Daniel Strunk" loading="lazy">
801    Daniel Strunk
802  </footer>
803</blockquote>
804    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter lg:col-span-2">
805  <p class="mb-3">I&#039;m supporting a modern marketing team, still on WordPress, and pairing it with Claude. The trick is skipping page builders. We run a custom PHP theme on Bedrock, which gives us git, CI/CD, and a codebase Claude can actually work in. New features ship fast, landing pages take minutes, and the plugin list is tiny. Page builders are the agent-unfriendly part. WordPress itself is fine.</p>
806  <footer class="flex items-center mt-auto text-sm">
807    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/pradnyanandana-suwitra-BY08JgpA.jpg" alt="Pradnyanandana Suwitra" loading="lazy">
808    Pradnyanandana Suwitra
809  </footer>
810</blockquote>
811  
812      <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter">
813  <p class="mb-3">If you have to use WordPress, use Bedrock for your web app and Sage to develop your custom theme. Any Laravel developer will feel at home in these tools.</p>
814  <footer class="flex items-center mt-auto text-sm">
815    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/rory-mcdaniel-CTlkgQxJ.jpg" alt="Rory McDaniel" loading="lazy">
816    Rory McDaniel
817  </footer>
818</blockquote>
819    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter">
820  <p class="mb-3">I think 2 years ago I tweeted to y&#039;all to say I love Sage -- now I&#039;m getting started with Bedrock and loving it! thank you for making me feel like WordPress can be sane, secure, and modern.</p>
821  <footer class="flex items-center mt-auto text-sm">
822    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/michael-snook-C2siJAXm.jpg" alt="Michael Snook" loading="lazy">
823    Michael Snook
824  </footer>
825</blockquote>
826    <blockquote class="flex flex-col p-3 border rounded-md md:p-5 lg:p-6 border-brand-lighter lg:col-span-2">
827  <p class="mb-3">There&#039;s a massive divide in WordPress right now. On one side, page builders — great for speed, but a mess of DOM bloat and heavy scripts under the hood. On the other, the modern stack: Bedrock and Sage. This is WordPress treated as professional software engineering. Treat plugins as dependencies via Composer, replace spaghetti PHP with Blade, and ship only the CSS and JS you actually use.</p>
828  <footer class="flex items-center mt-auto text-sm">
829    <img class="mr-3 rounded-full" width="28" height="28" src="https://roots.io/build/assets/savan-dholariya-7g6I_m-3.jpg" alt="Savan Dholariya" loading="lazy">
830    Savan Dholariya
831  </footer>
832</blockquote>
833  
834  
835  </div>
836    </div>
837    <div class="p-4 my-8 rounded-lg lg:p-8 bg-brand-lightest max-w-xl mx-auto" data-markdown-exclude>
838  <h4
839    class="font-bold text-sm mb-4 mb-3 uppercase text-sm font-bold"
840>
841    Subscribe for updates
842</h4>
843  <p class="mb-4"><b>Join over 8,000 subscribers</b> for the latest Roots updates, WordPress plugin recommendations, modern WordPress projects, and web development tips.</p>
844  <form id="subscribe" x-data="submitForm()" @submit.prevent="submitForm">
845  <fieldset class="flex min-w-0" x-show="!submitted">
846    <input type="email" value="" name="email" id="email" placeholder="Your email address" class="flex-1 min-w-0 px-4 py-4 border-2 rounded-lg border-brand-primary bg-white" required>
847    <button
848  class="inline-flex items-center font-semibold cursor-pointer transition-colors text-white bg-brand-primary hover:bg-brand-navy active:bg-brand-navy rounded-lg px-6 py-3 text-base   gap-2 ml-2"
849
850      type="submit"
851      name="submit"
852      id="submit"
853      x-bind:disabled="loading"
854  
855  >
856    Subscribe
857</button>
858  </fieldset>
859  <p x-show="submitted" x-cloak class="">One last step! Check your email for a verification link.</p>
860      <div class="cf-turnstile" data-sitekey="0x4AAAAAAAMIgqhGHHSkM45_"></div>
861  </form>
862
863<script>
864  function submitForm() {
865    return {
866      submitted: false,
867      loading: false,
868      submitForm() {
869        this.loading = true;
870        let formData = new FormData();
871        formData.append('email', document.getElementById('email').value);
872        formData.append('cf-turnstile-response', document.querySelector('[name="cf-turnstile-response"]').value);
873        fetch('/wp-json/forms/v1/newsletter', {
874          method: 'POST',
875          body: formData,
876        })
877          .then(response => {
878            if (response.ok) {
879              this.submitted = true;
880            } else {
881              this.loading = false;
882              alert('Try again');
883            }
884          })
885          .catch(() => alert('Try again'));
886      }
887    }
888  }
889</script>
vendor: 1 bytes, line 889
889
890<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" defer async></script>
890
891</div>
892  </div>
893        </main>
894
895        <footer x-data :class="$store.purchase?.fixed ? 'lg:pb-80' : ''" class="px-4 py-6 md:py-10 lg:py-14 mt-14 bg-brand-lightest text-brand-navy [&_a:hover]:text-brand-navy [&_a:hover_svg]:text-brand-navy [&_a:hover_svg_path]:fill-brand-700 [&_a:hover_svg_*]:fill-brand-700">
896  <div class="max-w-6xl mx-auto">
897    <div class="grid grid-cols-2 md:grid-cols-3 md:gap-4">
898      <section class="mt-3">
899        <h2
900    class="mb-4 text-xl font-bold"
901>
902    Ecosystem
903</h2>
904        <ul>
905                      <li class="mb-5">
906              <a class="flex items-center  font-bold " href="/radicle/">
907                <svg class="h-8 w-8 mr-2 radicle-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 280 292" style="enable-background:new 0 0 280 292" xml:space="preserve"><path d="m106 1 55 55-35 10-30-30 10-35zm0 110 75 75-90 30-90-90 30-90 75 75 55-55 55-55 20 65-65 65-65-20zm145.3 4.7 28.2 91.8L196 291H76l105-105 70.3-70.3z" fill="#525DDC"/></svg>                <div>
908                  Radicle
909                </div>
910              </a>
911            </li>
912                      <li class="mb-5">
913              <a class="flex items-center " href="/acorn/">
914                <svg class="h-8 w-8 mr-2" width="280" height="280" viewBox="0 0 280 280" xmlns="http://www.w3.org/2000/svg"><path d="M210 260h-60v-60l30-30 60 60-30 30zM95 135V95h90v40l-45 45-45-45zm35 125H70l-30-30 60-60 30 30v60zm75-130V65L140 0 75 65v65H0v85l65 65h150l65-65v-85h-75z" fill="#5361D9" fill-rule="evenodd"/></svg>                <div>
915                  Acorn
916                </div>
917              </a>
918            </li>
919                      <li class="mb-5">
920              <a class="flex items-center " href="/bedrock/">
921                <svg class="h-8 w-8 mr-2" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M1.233 0L0 1.233v16.034l1.057 1.057 34.886-5.815L37 13.567v11.1l35.52-5.92 1.48-1.48V1.233L72.767 0H1.233zm.247 30.587L0 32.067v9.866l1.057 1.057L37 37V24.667l-35.52 5.92zM37 37v12.334l35.52-5.92 1.48-1.48v-9.867l-1.057-1.057L37 37zM1.48 55.253L0 56.733v16.034L1.233 74h71.534L74 72.767V56.733l-1.057-1.057-34.886 5.815L37 60.434v-11.1l-35.52 5.92z" fill="#525DDC"/></svg>                <div>
922                  Bedrock
923                </div>
924              </a>
925            </li>
926                      <li class="mb-5">
927              <a class="flex items-center " href="/sage/">
928                <svg class="h-8 w-8 mr-2" width="81" height="74" viewBox="0 0 81 74" xmlns="http://www.w3.org/2000/svg"><path d="M24.837 10.873l5.755 17.07-15.065-10.55L0 28.266l5.897 17.492.034.1h18.622L9.487 56.408l5.897 17.493.034.099h19.191l5.755-17.07 5.72 16.97.034.1H65.31l5.93-17.592-15.065-10.55h18.622l5.93-17.592-15.526-10.873-15.066 10.55 5.755-17.07L40.364 0 24.837 10.873zm.352 34.786l5.797-17.194h18.755l5.797 17.194-15.174 10.626-15.175-10.626z" fill="#525DDC" fill-rule="nonzero"/></svg>                <div>
929                  Sage
930                </div>
931              </a>
932            </li>
933                      <li class="mb-5">
934              <a class="flex items-center " href="/trellis/">
935                <svg class="h-8 w-8 mr-2" width="74" height="74" viewBox="0 0 74 74" xmlns="http://www.w3.org/2000/svg"><path d="M60.125 0l-9.25 9.25L41.625 0H0v9.25h41.625l9.25 9.25 9.25-9.25H74V0H60.125zm-9.25 18.5l-9.25 9.25-9.25-9.25H0v9.25h32.375l9.25 9.25 9.25-9.25H74V18.5H50.875zM41.625 37l-9.25 9.25-9.25-9.25H0v9.25h23.125l9.25 9.25 9.25-9.25H74V37H41.625zm-9.25 18.5l-9.25 9.25-9.25-9.25H0v9.25h13.875l9.25 9.25 9.25-9.25H74V55.5H32.375z" fill="#525DDC" fill-rule="nonzero"/></svg>                <div>
936                  Trellis
937                </div>
938              </a>
939            </li>
940                    <li class="mb-5">
941            <a class="flex items-center [&:hover_svg_*]:!fill-none" href="https://wp-packages.org/">
942              <svg class="h-8 w-8 mr-2 text-brand-primary" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
943  <path stroke-linecap="round" stroke-linejoin="round" d="m21 7.5-9-5.25L3 7.5m18 0-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9"/>
944</svg>              <div>WP Packages</div>
945            </a>
946          </li>
947        </ul>
948      </section>
949
950      <section class="mt-3">
951        <h2
952    class="mb-4 text-xl font-bold"
953>
954    Resources
955</h2>
956        <ul class="mb-5">
957          <li><a class="block py-1" href="/getting-started/">Getting Started</a></li>
958          <li><a class="block py-1" href="/docs/">Documentation</a></li>
959          <li><a class="block py-1" href="/blog/">Blog</a></li>
960          <li><a class="block py-1" href="/newsletter/">Newsletter</a></li>
961          <li><a class="block py-1" href="/composer-wordpress-resources/">Composer with WordPress Resources</a></li>
962          <li><a class="block py-1" href="https://discourse.roots.io/tag/releases/61">Changelog</a></li>
963          <li><a class="block py-1" href="https://discourse.roots.io/">Community</a></li>
964        </ul>
965        <ul class="flex flex-row items-center gap-3 mb-5">
966          <li><a class="flex items-center" href="https://github.com/roots" aria-label="GitHub"><svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg> <span class="hidden lg:inline ml-1">GitHub</span></a></li>
967          <li><a class="flex items-center" href="https://x.com/rootswp" aria-label="X"><svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 24 24" fill="currentColor"><title>X</title><path d="M14.234 10.162 22.977 0h-2.072l-7.591 8.824L7.251 0H.258l9.168 13.343L.258 24H2.33l8.016-9.318L16.749 24h6.993zm-2.837 3.299-.929-1.329L3.076 1.56h3.182l5.965 8.532.929 1.329 7.754 11.09h-3.182z"/></svg> <span class="hidden lg:inline ml-1">@rootswp</span></a></li>
968          <li><a class="flex items-center" href="https://www.linkedin.com/company/rootsio/" aria-label="LinkedIn"><svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-linkedin" viewB
968ox="0 0 16 16">
969  <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z"/>
970</svg> <span class="hidden lg:inline ml-1">LinkedIn</span></a></li>
971        </ul>
972      </section>
973
974      <section class="col-span-2 mt-6 md:mt-3 md:col-span-1">
975        <h2
976    class="mb-4 text-xl font-bold"
977>
978    About
979</h2>
980        <p class="mb-6">
981          <a href="/about/">Roots</a> is an independent open source organization that has been improving the WordPress developer experience since 2011. <a href="/support/">We offer professional services and support for WordPress projects</a>.
982        </p>
983        <a href="/sponsors/" class="block bg-white border border-brand-lighter rounded-lg p-3 font-bold">Support Roots &mdash; become a sponsor</a>
984        <p class="mt-3 mb-6 text-sm">
985          Sponsored by
986          <a href="https://carrot.com/" rel="sponsored">Carrot</a>,
987          <a href="https://wordpress.com/" rel="sponsored">WordPress.com</a>,
988          <a href="https://www.itineris.co.uk/" rel="sponsored">Itineris</a>,
989          <a href="https://kinsta.com/?kaid=OFDHAJIXUDIV" rel="sponsored">Kinsta</a>,
990          and all of our <a href="/sponsors/">individual sponsors</a>
991        </p>
992        <ul class="-ml-3 text-sm">
993          <li class="inline-block"><a href="/privacy/" class="block p-3">Privacy Policy</a></li>
994          <li class="inline-block"><a href="/refunds/" class="block p-3">Refund Policy</a></li>
995        </ul>
996      </section>
997    </div>
998
999    <section class="mt-12">
1000      <p class="font-mono text-xs font-light uppercase">Powered by <a href="/radicle/">Radicle</a>, <a href="/trellis/">Trellis</a>, and <a href="https://www.digitalocean.com/?refcode=09f11cfb5bac">DigitalOcean</a></p>
1001    </section>
1002  </div>
1003</footer>
1004
1005<script>
1006function copy() {
1007  return {
1008    menuStyle: '',
1009
1010    handleRightClick(event) {
1011      if (this.brandMenuOpen) {
1012        event.preventDefault();
1013        const x = event.clientX;
1014        const y = event.clientY;
1015
1016        const menuWidth = 200;
1017        const menuHeight = 120;
1018
1019        const adjustedX = Math.min(x, window.innerWidth - menuWidth);
1020        const adjustedY = Math.min(y, window.innerHeight - menuHeight);
1021
1022        this.menuStyle = `left: ${adjustedX}px; top: ${adjustedY}px;`;
1023      }
1024    },
1025
1026    copySvg(url) {
1027      if (typeof ClipboardItem && navigator.clipboard.write) {
1028        const svgEl = document.createElement("div");
1029        const svgData = new ClipboardItem({
1030          "text/plain": fetch(url)
1031            .then(response => response.text())
1032            .then((svgData) => {
1033              const parser = new DOMParser();
1034              const svgDoc = parser.parseFromString(svgData, "image/svg+xml");
1035              svgEl.appendChild(svgDoc.documentElement);
1036              document.body.appendChild(svgEl);
1037              const svgText = svgEl.innerHTML;
1038              return new Blob([svgText], { type: "text/plain" });
1039            })
1040        })
1041        navigator.clipboard.write([svgData])
1042          .then(() => {
1043            this.$dispatch('notice', {type: 'success', text: 'Copied to clipboard'});
1044            if (svgEl.parentNode) {
1045              svgEl.parentNode.removeChild(svgEl);
1046            }
1047          })
1048          .catch(() => {
1049            if (svgEl.parentNode) {
1050              svgEl.parentNode.removeChild(svgEl);
1051            }
1052            this.$dispatch('notice', {type: 'error', text: 'Failed to copy to clipboard'})
1053          });
1054      } else {
1055        fetch(url)
1056          .then((response) => response.text())
1057          .then((svgData) => {
1058            const parser = new DOMParser();
1059            const svgDoc = parser.parseFromString(svgData, "image/svg+xml");
1060            const svgEl = document.createElement("div");
1061            svgEl.appendChild(svgDoc.documentElement);
1062            document.body.appendChild(svgEl);
1063            const svgText = svgEl.innerHTML;
1064            navigator.clipboard
1065              .writeText(svgText)
1066              .then(() => {
1067                this.$dispatch('notice', {type: 'success', text: 'Copied to clipboard'})
1068                document.body.removeChild(svgEl);
1069              })
1070              .catch((error) => {
1071                this.$dispatch('notice', {type: 'error', text: 'Failed to copy to clipboard'})
1072                document.body.removeChild(svgEl);
1073              });
1074          })
1075          .catch((error) => {
1076            this.$dispatch('notice', {type: 'error', text: 'Failed to copy to clipboard'})
1077          });
1078      }
1079    },
1080  };
1081}
1082</script>
1082
1083
1084<div
1085  x-data="noticesHandler()"
1086  class="fixed inset-0 flex flex-col-reverse items-end justify-start h-screen w-screen"
1087  @notice.window="add($event.detail)"
1088  style="pointer-events: none;"
1089>
1090  <template x-for="notice of notices" :key="notice.id">
1091    <div
1092      x-show="visible.includes(notice)"
1093      x-transition:enter="transition ease-in duration-200"
1094      x-transition:enter-start="transform opacity-0 translate-y-2"
1095      x-transition:enter-end="transform opacity-100"
1096      x-transition:leave="transition ease-out duration-500"
1097      x-transition:leave-start="transform translate-x-0 opacity-100"
1098      x-transition:leave-end="transform translate-x-full opacity-0"
1099      @click="remove(notice.id)"
1100      class="border-2 border-brand-primary rounded-lg px-4 py-3 mb-4 mr-6 flex items-center justify-center cursor-pointer bg-white"
1101      style="pointer-events:all"
1102      x-text="notice.text">
1103    </div>
1104  </template>
1105</div>
1106
1107<script>
1108function noticesHandler() {
1109  return {
1110    notices: [],
1111    visible: [],
1112    add(notice) {
1113      notice.id = Date.now();
1114      this.notices.push(notice);
1115      this.fire(notice.id);
1116    },
1117    fire(id) {
1118      this.visible.push(this.notices.find((notice) => notice.id == id));
1119      const timeShown = 2000 * this.visible.length;
1120      setTimeout(() => {
1121        this.remove(id);
1122      }, timeShown);
1123    },
1124    remove(id) {
1125      const notice = this.visible.find((notice) => notice.id == id);
1126      const index = this.visible.indexOf(notice);
1127      this.visible.splice(index, 1);
1128    },
1129  };
1130}
1131</script>
1131
1132        
1132<script type="speculationrules">
1133{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp/wp-*.php","/wp/wp-admin/*","/app/uploads/*","/app/*","/app/plugins/*","/app/themes/roots/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
1134</script>
1134
1135
1136      </div>
1137    </div>
1138
1139    
1140
1141              
1141<script async src="https://a.roots.io/h.js"></script>
1141
1142      
1142<script async defer src="/u.js" data-website-id="58303a78-5f91-40b3-8773-eece39c00aaf" data-host-url="/api/u"></script>
1142
1143      
1143<script defer src='/b.js' data-cf-beacon='{"token": "dc837310f75646d2ab6aee97b9d5098a"}'></script>
1143
1144      </body>
1145</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.