feat: adjust styles to match figmas and moved icons as react components (#6143)

* feat: made all icons as react components

* chore: removed original svg images of the now react components

* fix: fixed storybooks, styles, icons and isolated markdown styles

* fix: more style fixes

* fix: fixed more styles

* fix: flex-grow-shink for breadcrumbs

* meta: some doc improvements for storybook

.storybook/main.ts

···
   framework: { name: '@storybook/nextjs', options: {} },
   webpack: async config => ({
     ...config,
+    // We want to conform as much as possible with our target settings
     target: 'browserslist',
+    // Performance Hints do not make sense on Storybook as it is bloated by design
     performance: { hints: false },
+    // `nodevu` is a Node.js-specific package that requires Node.js modules
+    // this is incompatible with Storybook. So we just mock the module
     resolve: { ...config.resolve, alias: { '@nodevu/core': false } },
+    // Removes Pesky Critical Dependency Warnings due to `next/font`
+    ignoreWarnings: [e => e.message.includes('Critical dep')],
   }),
 };
 

.stylelintrc.mjs

···
     'selector-class-pattern': ONLY_ALLOW_CAMEL_CASE_SELECTORS,
     // Enforces Element IDs to be camelCase
     'selector-id-pattern': ONLY_ALLOW_CAMEL_CASE_SELECTORS,
+    // Allow Tailwind-based CSS Rules
     'at-rule-no-unknown': [true, { ignoreAtRules: CUSTOM_AT_RULES }],
+    // Allow the Global CSS Selector
+    'selector-pseudo-class-no-unknown': [
+      true,
+      { ignorePseudoClasses: ['global'] },
+    ],
     // Enforces the order of the CSS properties to be in alphabetical order
     'order/properties-alphabetical-order': true,
     'no-descending-specificity': null,

components/Common/AvatarGroup/Avatar/index.stories.tsx

···
 
 export const NoSquare: Story = {
   args: {
-    src: '/static/images/logos/stacked-dark.svg',
+    src: '/static/images/logos/nodejs.png',
     alt: 'SD',
   },
 };

components/Common/Banner/index.module.css

···
 
   a {
     @apply w-fit
-      underline;
+      underline
+      decoration-white-opaque;
   }
 
   svg {
     @apply h-4
-      w-4;
+      w-4
+      text-white-opaque;
   }
 }
 

components/Common/Banner/index.stories.tsx

···
 
 export const Default: Story = {
   args: {
-    text: 'Nodejs collaborator summitNode.js Collaborator Summit 2023 - Bilbao, Spain (OpenJS World EU) 2023',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
     type: 'default',
     url: 'https://github.com/openjs-foundation/summit/issues/360',
   },
···
 
 export const Error: Story = {
   args: {
-    text: 'STOP creating issue for error 500 on download',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
     type: 'error',
     url: 'https://github.com/nodejs/nodejs.org/issues/4495',
   },
···
 
 export const Warning: Story = {
   args: {
-    text: 'STOP creating issue for error 500 on download',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
     type: 'warning',
     url: 'https://github.com/nodejs/nodejs.org/issues/4495',
   },
···
 
 export const NoLink: Story = {
   args: {
-    text: 'Claudio is the best maintainer',
+    text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
     type: 'default',
-  },
-};
-
-export const NoType: Story = {
-  args: {
-    text: 'Claudio is the best maintainer',
-    url: 'https://github.com/ovflowd',
   },
 };
 

components/Common/Breadcrumbs/BreadcrumbItem/index.module.css

···
     text-sm
     font-medium;
 
+  a {
+    @apply flex-shrink
+      flex-grow;
+  }
+
   &,
   > a,
   > a:hover {
···
   .separator {
     @apply h-4
       w-4
+      flex-shrink-0
+      flex-grow
       text-neutral-600
       dark:text-neutral-400;
   }

components/Common/MetaBar/index.stories.tsx

···
 import { CodeBracketIcon } from '@heroicons/react/24/outline';
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
-import Image from 'next/image';
 
 import AvatarGroup from '@/components/Common/AvatarGroup';
 import MetaBar from '@/components/Common/MetaBar';
+import GitHub from '@/components/Icons/Social/GitHub';
 import Link from '@/components/Link';
 
 type Story = StoryObj<typeof MetaBar>;
···
       ),
       'components.metabar.contribute': (
         <>
-          <Image
-            src="/static/images/logos/social-github-dark.svg"
-            alt="GitHub Logo"
-            width={16}
-            height={16}
-            data-on-light
-          />
-          <Image
-            src="/static/images/logos/social-github.svg"
-            alt="GitHub Logo"
-            width={16}
-            height={16}
-            data-on-dark
-          />
+          <GitHub className="fill-neutral-700 dark:fill-neutral-100" />
           <Link href="/contribute">Edit this page</Link>
         </>
       ),

components/Common/Pagination/Ellipsis/index.module.css

···
   @apply w-10
     px-3
     py-2.5
+    leading-none
     text-neutral-800
     dark:text-neutral-200;
 }

components/Common/Preview/index.tsx

···
 import classNames from 'classnames';
-import Image from 'next/image';
 import type { CSSProperties, ComponentProps, FC, ReactNode } from 'react';
 
-import { BASE_PATH } from '@/next.constants.mjs';
+import JsIconWhite from '@/components/Icons/Logos/JsIconWhite';
 
 import styles from './index.module.css';
 
···
     className={classNames(styles.root, styles[type], props.className)}
   >
     <div className={styles.container}>
-      <Image
-        className={styles.logo}
-        priority
-        width="71"
-        height="80"
-        src={`${BASE_PATH}/static/images/logos/js-white.svg`}
-        alt="Node.js"
-      />
+      <JsIconWhite className={styles.logo} width={71} height={80} />
       <h2>{title}</h2>
     </div>
   </div>

components/Common/Select/index.stories.tsx

···
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
 import Select from '@/components/Common/Select';
+import Apple from '@/components/Icons/Platform/Apple';
+import Linux from '@/components/Icons/Platform/Linux';
+import Microsoft from '@/components/Icons/Platform/Microsoft';
 
 type Story = StoryObj<typeof Select>;
 type Meta = MetaObj<typeof Select>;
···
       {
         value: 'linux',
         label: 'Linux',
-        iconImageUrl: '/static/images/logos/platform-linux.svg',
+        iconImage: <Linux width={16} height={16} />,
       },
       {
         value: 'macos',
         label: 'MacOS',
-        iconImageUrl: '/static/images/logos/platform-apple.svg',
+        iconImage: <Apple width={16} height={16} />,
       },
       {
         value: 'windows',
         label: 'Windows',
-        iconImageUrl: '/static/images/logos/platform-microsoft.svg',
+        iconImage: <Microsoft width={16} height={16} />,
       },
     ],
     dropdownLabel: 'Platform',

components/Common/Select/index.tsx

···
 import { ChevronDownIcon } from '@heroicons/react/24/outline';
 import * as Primitive from '@radix-ui/react-select';
 import classNames from 'classnames';
-import Image from 'next/image';
 import { useId, useMemo } from 'react';
 import type { FC } from 'react';
 
···
 type SelectValue = {
   label: string;
   value: string;
-  iconImageUrl?: string;
+  iconImage?: React.ReactNode;
 };
 
 type SelectProps = {
···
                     {dropdownLabel}
                   </Primitive.Label>
                 )}
-                {mappedValues.map(({ value, label, iconImageUrl }) => (
+                {mappedValues.map(({ value, label, iconImage }) => (
                   <Primitive.Item
                     key={value}
                     value={value}
                     className={`${styles.item} ${styles.text}`}
                   >
                     <Primitive.ItemText>
-                      {iconImageUrl && (
-                        <Image
-                          src={iconImageUrl}
-                          alt={label}
-                          width={16}
-                          height={16}
-                        />
-                      )}
+                      {iconImage}
                       {label}
                     </Primitive.ItemText>
                   </Primitive.Item>

components/Containers/Footer/index.module.css

···
         gap-1;
     }
   }
-
-  .darkImage {
-    @apply hidden
-      dark:block;
-  }
-
-  .lightImage {
-    @apply block
-      dark:hidden;
-  }
 }

components/Containers/Footer/index.tsx

···
-import classNames from 'classnames';
-import Image from 'next/image';
 import { useTranslations } from 'next-intl';
-import type { FC } from 'react';
+import type { FC, SVGProps } from 'react';
 
 import NavItem from '@/components/Containers/NavItem';
+import GitHub from '@/components/Icons/Social/GitHub';
+import LinkedIn from '@/components/Icons/Social/LinkedIn';
+import Mastodon from '@/components/Icons/Social/Mastodon';
+import Slack from '@/components/Icons/Social/Slack';
+import Twitter from '@/components/Icons/Social/Twitter';
 import { siteConfig } from '@/next.json.mjs';
 
 import styles from './index.module.css';
 
+const footerSocialIcons: Record<string, React.FC<SVGProps<SVGSVGElement>>> = {
+  github: GitHub,
+  mastodon: Mastodon,
+  twitter: Twitter,
+  slack: Slack,
+  linkedin: LinkedIn,
+};
+
 const Footer: FC = () => {
   const t = useTranslations();
 
···
           </NavItem>
         ))}
       </div>
+
       <div className={styles.sectionSecondary}>
         <NavItem type="footer" href={openJSlink.link}>
           &copy; {t(openJSlink.text)}
         </NavItem>
+
         <div className={styles.social}>
           {siteConfig.socialLinks.map(link => {
-            const navClass = classNames({
-              [styles.darkImage]: link.kind === 'dark',
-              [styles.lightImage]: link.kind === 'light',
-            });
+            const SocialIcon = footerSocialIcons[link.icon];
 
             return (
-              <NavItem
-                className={navClass}
-                key={link.icon}
-                href={link.link}
-                type="footer"
-              >
-                <Image
-                  src={link.icon}
-                  alt={link.alt || 'social'}
-                  width={20}
-                  height={20}
-                />
+              <NavItem key={link.icon} href={link.link} type="footer">
+                <SocialIcon width={20} height={20} />
               </NavItem>
             );
           })}

components/Containers/NavigationBar/index.stories.tsx

···
     navItems: [
       {
         text: 'Learn',
-        href: '/learn',
+        href: '/',
       },
       {
         text: 'About',

components/Containers/NavigationBar/index.tsx

···
 import LanguageDropdown from '@/components/Common/LanguageDropDown';
 import ThemeToggle from '@/components/Common/ThemeToggle';
 import NavItem from '@/components/Containers/NavItem';
-import GithubLogo from '@/components/Icons/GitHubLogo';
-import NodejsLogoDark from '@/components/Icons/NodejsLogoDark';
-import NodejsLogoLight from '@/components/Icons/NodejsLogoLight';
+import NodejsDark from '@/components/Icons/Logos/NodejsDark';
+import NodejsLight from '@/components/Icons/Logos/NodejsLight';
+import GitHub from '@/components/Icons/Social/GitHub';
 
 import style from './index.module.css';
 
···
     <nav className={`${style.container}`}>
       <div className={style.nodeIconAndMobileItemsToggler}>
         <div className={style.nodeIconWrapper}>
-          <NodejsLogoDark className={style.nodejsLogoDark} />
-          <NodejsLogoLight className={style.nodejsLogoLight} />
+          <NodejsDark className={style.nodejsLogoDark} />
+          <NodejsLight className={style.nodejsLogoLight} />
         </div>
         <Label.Root
           onClick={() => setIsMenuOpen(prev => !prev)}
···
             href="https://github.com/nodejs/node"
             aria-label="Node.js Github"
           >
-            <GithubLogo />
+            <GitHub />
           </a>
         </div>
       </div>

components/Containers/ProgressionSidebar/ProgressionSidebarGroup/index.module.css

···
 
     &::after {
       @apply absolute
-        left-[calc(0.5rem-0.5px)]
+        left-[0.45rem]
         top-0
         z-10
         h-full

components/Downloads/ChangelogModal/index.module.css

···
       inline-flex
       w-full
       flex-col
-      overflow-scroll
+      overflow-y-scroll
       rounded
       border
       border-neutral-200
···
   }
 
   .wrapper {
-    @apply flex
-      flex-col
-      gap-4;
+    :global(.mdxContent) {
+      @apply flex
+        flex-col
+        gap-4;
 
-    h1,
-    h2,
-    h3,
-    h4,
-    h5,
-    p,
-    a {
-      @apply text-neutral-900
-        dark:text-white;
-    }
+      a {
+        @apply underline;
+      }
 
-    a {
-      @apply underline;
-    }
-
-    pre {
-      @apply overflow-auto;
+      pre {
+        @apply overflow-auto;
+      }
     }
   }
 }

components/Icons/GitHubLogo.tsx components/Icons/Social/GitHub.tsx

···
-import type { FC, HTMLAttributes } from 'react';
+import type { FC, SVGProps } from 'react';
 
-const GitHubLogo: FC<HTMLAttributes<SVGElement>> = props => (
+const GitHub: FC<SVGProps<SVGSVGElement>> = props => (
   <svg
     width="20"
     height="20"
     viewBox="0 0 20 20"
-    xmlns="http://www.w3.org/2000/svg"
     fill="currentColor"
+    xmlns="http://www.w3.org/2000/svg"
     {...props}
   >
     <path d="M10 1.25C5.16562 1.25 1.25 5.16562 1.25 10C1.25 13.8719 3.75469 17.1422 7.23281 18.3016C7.67031 18.3781 7.83437 18.1156 7.83437 17.8859C7.83437 17.6781 7.82344 16.9891 7.82344 16.2563C5.625 16.6609 5.05625 15.7203 4.88125 15.2281C4.78281 14.9766 4.35625 14.2 3.98438 13.9922C3.67812 13.8281 3.24063 13.4234 3.97344 13.4125C4.6625 13.4016 5.15469 14.0469 5.31875 14.3094C6.10625 15.6328 7.36406 15.2609 7.86719 15.0312C7.94375 14.4625 8.17344 14.0797 8.425 13.8609C6.47813 13.6422 4.44375 12.8875 4.44375 9.54062C4.44375 8.58906 4.78281 7.80156 5.34062 7.18906C5.25313 6.97031 4.94687 6.07344 5.42812 4.87031C5.42812 4.87031 6.16094 4.64063 7.83437 5.76719C8.53438 5.57031 9.27813 5.47187 10.0219 5.47187C10.7656 5.47187 11.5094 5.57031 12.2094 5.76719C13.8828 4.62969 14.6156 4.87031 14.6156 4.87031C15.0969 6.07344 14.7906 6.97031 14.7031 7.18906C15.2609 7.80156 15.6 8.57812 15.6 9.54062C15.6 12.8984 13.5547 13.6422 11.6078 13.8609C11.925 14.1344 12.1984 14.6594 12.1984 15.4797C12.1984 16.65 12.1875 17.5906 12.1875 17.8859C12.1875 18.1156 12.3516 18.3891 12.7891 18.3016C14.5261 17.7152 16.0355 16.5988 17.1048 15.1096C18.1741 13.6204 18.7495 11.8333 18.75 10C18.75 5.16562 14.8344 1.25 10 1.25Z" />
   </svg>
 );
 
-export default GitHubLogo;
+export default GitHub;

components/Icons/Logos/JsIconGreen.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const JsIconGreen: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="71"
+    height="80"
+    viewBox="0 0 71 80"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_337_7891)" fill="#5FA04E">
+      <path d="M35.625 79.5c-1.081 0-2.09-.288-3.028-.792l-9.59-5.686c-1.442-.792-.721-1.08-.289-1.224 1.947-.648 2.308-.792 4.327-1.944.216-.144.504-.072.72.072l7.356 4.391c.288.144.649.144.865 0l28.77-16.628c.289-.144.433-.431.433-.791V23.714c0-.36-.144-.648-.432-.792L35.986 6.366c-.288-.144-.65-.144-.865 0L6.35 22.922c-.29.144-.434.504-.434.792v33.184c0 .287.145.647.433.791l7.86 4.535c4.254 2.16 6.922-.36 6.922-2.879V26.593c0-.432.36-.864.865-.864h3.678c.432 0 .865.36.865.864v32.752c0 5.687-3.1 8.998-8.509 8.998-1.658 0-2.956 0-6.633-1.8l-7.572-4.319A6.073 6.073 0 0 1 .798 56.97V23.786a6.073 6.073 0 0 1 3.028-5.255l28.77-16.628c1.804-1.008 4.255-1.008 6.058 0l28.77 16.628a6.073 6.073 0 0 1 3.029 5.255V56.97a6.073 6.073 0 0 1-3.029 5.254l-28.77 16.628c-.865.36-1.947.648-3.029.648Z" />
+      <path d="M44.567 56.682c-12.62 0-15.215-5.759-15.215-10.654 0-.432.36-.864.865-.864h3.75c.433 0 .793.288.793.72.577 3.815 2.235 5.687 9.879 5.687 6.057 0 8.652-1.368 8.652-4.607 0-1.871-.72-3.24-10.167-4.175-7.86-.792-12.762-2.52-12.762-8.782 0-5.83 4.903-9.285 13.123-9.285 9.23 0 13.772 3.167 14.35 10.077 0 .216-.073.432-.217.648-.144.144-.36.288-.577.288h-3.822a.844.844 0 0 1-.793-.648c-.865-3.96-3.1-5.255-9.013-5.255-6.634 0-7.427 2.304-7.427 4.031 0 2.088.937 2.736 9.879 3.887 8.869 1.152 13.05 2.808 13.05 8.998 0 6.335-5.263 9.934-14.348 9.934Z" />
+    </g>
+    <defs>
+      <clipPath id="clip0_337_7891">
+        <path fill="#fff" d="M0 .5h71v79H0z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default JsIconGreen;

components/Icons/Logos/JsIconWhite.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const JsIconWhite: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="71"
+    height="80"
+    viewBox="0 0 71 80"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_337_7892)">
+      <path
+        d="M35.1193 79.5C34.0343 79.5 33.0217 79.2106 32.0813 78.7041L22.4611 72.9884C21.0144 72.1925 21.7378 71.9031 22.1718 71.7584C24.1247 71.1072 24.4864 70.9625 26.5117 69.8049C26.7287 69.6602 27.0181 69.7326 27.2351 69.8773L34.613 74.2907C34.9023 74.4354 35.264 74.4354 35.481 74.2907L64.3417 57.5775C64.6311 57.4328 64.7757 57.1434 64.7757 56.7817V23.4276C64.7757 23.0659 64.6311 22.7765 64.3417 22.6318L35.481 5.99096C35.1917 5.84626 34.83 5.84626 34.613 5.99096L5.75223 22.6318C5.4629 22.7765 5.31823 23.1382 5.31823 23.4276V56.7817C5.31823 57.0711 5.4629 57.4328 5.75223 57.5775L13.6365 62.1357C17.9041 64.3062 20.5804 61.7739 20.5804 59.2416V26.3217C20.5804 25.8876 20.9421 25.4535 21.4484 25.4535H25.1374C25.5714 25.4535 26.0054 25.8152 26.0054 26.3217V59.2416C26.0054 64.9574 22.8951 68.2855 17.4701 68.2855C15.8065 68.2855 14.5045 68.2855 10.8155 66.4767L3.22059 62.1357C1.33994 61.0504 0.182617 59.0246 0.182617 56.854V23.5C0.182617 21.3295 1.33994 19.3036 3.22059 18.2183L32.0813 1.50517C33.8897 0.492253 36.349 0.492253 38.1573 1.50517L67.0181 18.2183C68.8987 19.3036 70.056 21.3295 70.056 23.5V56.854C70.056 59.0246 68.8987 61.0504 67.0181 62.1357L38.1573 78.8488C37.2893 79.2106 36.2043 79.5 35.1193 79.5Z"
+        fill="white"
+      />
+      <path
+        d="M44.0884 56.5646C31.4302 56.5646 28.8262 50.7765 28.8262 45.8566C28.8262 45.4225 29.1878 44.9883 29.6942 44.9883H33.4555C33.8895 44.9883 34.2511 45.2778 34.2511 45.7119C34.8298 49.5465 36.4934 51.4276 44.1607 51.4276C50.2367 51.4276 52.8406 50.0529 52.8406 46.7971C52.8406 44.916 52.1173 43.5413 42.6417 42.6008C34.7575 41.8049 29.8388 40.0685 29.8388 33.7739C29.8388 27.9134 34.7575 24.4406 43.0034 24.4406C52.262 24.4406 56.8189 27.624 57.3976 34.5697C57.3976 34.7868 57.3253 35.0039 57.1806 35.2209C57.0359 35.3656 56.8189 35.5103 56.6019 35.5103H52.7683C52.4066 35.5103 52.045 35.2209 51.9726 34.8592C51.1047 30.8798 48.8623 29.5775 42.9311 29.5775C36.2764 29.5775 35.4808 31.8927 35.4808 33.6292C35.4808 35.7274 36.4211 36.3785 45.3904 37.5362C54.2873 38.6938 58.4826 40.3579 58.4826 46.5801C58.4826 52.947 53.2023 56.5646 44.0884 56.5646Z"
+        fill="white"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_337_7892">
+        <rect
+          width="71"
+          height="79"
+          fill="white"
+          transform="translate(0 0.5)"
+        />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default JsIconWhite;

components/Icons/Logos/NodejsStackedBlack.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const NodejsStackedBlack: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="267"
+    height="164"
+    viewBox="0 0 267 164"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_337_7902)">
+      <mask
+        id="mask0_337_7902"
+        style={{ maskType: 'luminance' }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="267"
+        height="164"
+      >
+        <path d="M267 0H0v164h267V0Z" fill="#fff" />
+      </mask>
+      <g mask="url(#mask0_337_7902)">
+        <path
+          d="M131.991 164c-.905 0-1.75-.242-2.534-.666l-8.027-4.78c-1.207-.666-.604-.908-.242-1.029 1.63-.545 1.931-.666 3.621-1.634.181-.121.423-.061.604.06l6.156 3.692c.241.121.543.121.724 0l24.141-13.98c.242-.121.362-.363.362-.665V117.1c0-.303-.12-.545-.362-.666l-24.081-13.919c-.241-.121-.543-.121-.724 0l-24.08 13.919c-.242.121-.363.424-.363.666v27.898c0 .242.121.544.363.665l6.578 3.813c3.561 1.816 5.794-.303 5.794-2.421V119.52c0-.363.302-.726.724-.726h3.078c.362 0 .724.303.724.726v27.535c0 4.781-2.595 7.565-7.121 7.565-1.388 0-2.475 0-5.553-1.513l-6.337-3.631a5.11 5.11 0 0 1-2.535-4.418V117.16c0-1.815.966-3.51 2.535-4.418l24.141-13.979c1.509-.847 3.561-.847 5.07 0l24.141 13.979a5.112 5.112 0 0 1 2.535 4.418v27.898a5.11 5.11 0 0 1-2.535 4.418l-24.141 13.979c-.905.303-1.811.545-2.656.545Z"
+          fill="#5FA04E"
+        />
+        <path
+          d="M139.415 144.756c-10.562 0-12.735-4.842-12.735-8.957 0-.363.302-.726.724-.726h3.139c.362 0 .664.242.664.605.482 3.208 1.871 4.781 8.268 4.781 5.07 0 7.242-1.15 7.242-3.873 0-1.573-.603-2.723-8.509-3.51-6.579-.666-10.683-2.118-10.683-7.383 0-4.902 4.104-7.807 10.984-7.807 7.725 0 11.528 2.663 12.01 8.473 0 .181-.06.363-.181.544-.12.121-.301.242-.482.242h-3.199a.707.707 0 0 1-.664-.544c-.724-3.329-2.595-4.418-7.544-4.418-5.553 0-6.216 1.937-6.216 3.389 0 1.755.784 2.3 8.268 3.268 7.423.968 10.924 2.36 10.924 7.625 0 5.265-4.346 8.291-12.01 8.291ZM174.178 115.466c0 2.541-2.113 4.659-4.648 4.659a4.655 4.655 0 0 1-4.647-4.659c0-2.663 2.173-4.66 4.647-4.66a4.656 4.656 0 0 1 4.648 4.66Zm-8.51 0c0 2.178 1.75 3.933 3.862 3.933 2.173 0 3.923-1.815 3.923-3.933 0-2.179-1.75-3.873-3.923-3.873a3.855 3.855 0 0 0-3.862 3.873Zm2.112-2.603h1.811c.603 0 1.81 0 1.81 1.392 0 .969-.603 1.15-.965 1.271.724.061.784.545.845 1.211.06.423.12 1.149.241 1.391h-1.086c0-.242-.181-1.573-.181-1.634-.061-.302-.181-.423-.543-.423h-.906v2.118h-1.026v-5.326Zm1.026 2.3h.785c.664 0 .784-.484.784-.726 0-.726-.482-.726-.784-.726h-.845v1.452h.06Z"
+          fill="#5FA04E"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M57.275 54.828a3.08 3.08 0 0 0-1.57-2.663L30.177 37.34c-.422-.242-.905-.363-1.388-.424h-.241c-.483 0-.966.182-1.388.424L1.569 52.105A3.105 3.105 0 0 0 0 54.828l.06 39.699c0 .545.302 1.09.785 1.331.483.303 1.086.303 1.509 0l15.209-8.714a3.08 3.08 0 0 0 1.569-2.663V65.903A3.08 3.08 0 0 1 20.7 63.24l6.458-3.752c.483-.303 1.026-.424 1.569-.424.543 0 1.086.121 1.509.424l6.457 3.752a3.08 3.08 0 0 1 1.57 2.663V84.48a3.08 3.08 0 0 0 1.569 2.663l15.088 8.714a1.47 1.47 0 0 0 1.57 0c.482-.242.784-.786.784-1.331V54.828ZM180.334.182c-.483-.243-1.087-.243-1.509 0-.483.302-.785.786-.785 1.33V40.85c0 .363-.181.726-.543.968a1.151 1.151 0 0 1-1.086 0l-6.397-3.691a3.103 3.103 0 0 0-3.078 0l-25.59 14.826a3.08 3.08 0 0 0-1.569 2.663v29.592a3.08 3.08 0 0 0 1.569 2.663l25.59 14.827a3.107 3.107 0 0 0 3.078 0l25.589-14.827a3.08 3.08 0 0 0 1.569-2.663v-73.77c0-1.15-.603-2.178-1.569-2.723L180.334.182Zm-2.414 75.282c0 .303-.121.545-.362.666l-8.752 5.083a.892.892 0 0 1-.784 0l-8.751-5.083c-.242-.121-.362-.424-.362-.666V65.297c0-.302.12-.544.362-.665l8.751-5.084a.892.892 0 0 1 .784 0l8.752 5.084c.241.12.362.423.362.665v10.167ZM265.491 65.055c.966-.544 1.509-1.573 1.509-2.662V55.19c0-1.09-.603-2.118-1.509-2.663l-25.408-14.766a3.103 3.103 0 0 0-3.078 0l-25.59 14.827a3.082 3.082 0 0 0-1.569 2.663v29.592c0 1.09.604 2.118 1.569 2.663l25.409 14.524c.965.545 2.112.545 3.017 0l15.39-8.593c.483-.242.785-.787.785-1.332 0-.544-.302-1.089-.785-1.331l-25.71-14.827c-.483-.302-.784-.786-.784-1.331v-9.26c0-.544.301-1.088.784-1.33l8.027-4.6a1.47 1.47 0 0 1 1.569 0l8.027 4.6c.483.302.785.786.785 1.33v7.263c0 .545.301 1.09.784 1.331a1.47 1.47 0 0 0 1.569 0l15.209-8.896Z"
+          fill="#333"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M238.152 63.663a.546.546 0 0 1 .603 0l4.889 2.845a.636.636 0 0 1 .302.544v5.689a.636.636 0 0 1-.302.545l-4.889 2.844a.546.546 0 0 1-.603 0l-4.889-2.844a.636.636 0 0 1-.302-.545v-5.689c0-.242.121-.423.302-.544l4.889-2.844Z"
+          fill="#5FA04E"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M96.987 37.883a3.104 3.104 0 0 1 3.078 0l25.348 14.706c.966.545 1.509 1.573 1.509 2.663v29.35c0 1.09-.604 2.118-1.509 2.663l-25.348 14.705a3.102 3.102 0 0 1-3.078 0L71.639 87.265c-.966-.545-1.51-1.573-1.51-2.663v-29.41c0-1.09.604-2.119 1.51-2.664l25.348-14.645Z"
+          fill="url(#paint0_linear_337_7902)"
+        />
+        <path
+          opacity=".66"
+          d="m125.292 52.528-25.227-14.705a4.192 4.192 0 0 0-.785-.303L70.733 86.54c.242.302.544.544.845.726l25.409 14.706c.784.423 1.63.544 2.414.242l26.676-48.958c-.181-.303-.483-.545-.785-.727Z"
+          fill="#B4B4B4"
+        />
+        <path
+          d="m100.004 101.97 25.288-14.705c.966-.545 1.388-1.573 1.388-2.663v-.12L99.28 37.58c-.784-.242-1.63-.121-2.353.302L71.82 52.407l27.28 49.866a3.12 3.12 0 0 0 .904-.303Z"
+          fill="url(#paint1_linear_337_7902)"
+        />
+      </g>
+    </g>
+    <defs>
+      <linearGradient
+        id="paint0_linear_337_7902"
+        x1="70.117"
+        y1="69.914"
+        x2="126.971"
+        y2="69.914"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset=".005" />
+        <stop offset=".194" stopColor="#171717" />
+        <stop offset=".542" stopColor="#3D3D3D" />
+        <stop offset=".824" stopColor="#545454" />
+        <stop offset="1" stopColor="#5C5C5C" />
+      </linearGradient>
+      <linearGradient
+        id="paint1_linear_337_7902"
+        x1="69.724"
+        y1="69.872"
+        x2="128.373"
+        y2="69.872"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#5C5C5C" />
+        <stop offset=".176" stopColor="#545454" />
+        <stop offset=".458" stopColor="#3D3D3D" />
+        <stop offset=".806" stopColor="#171717" />
+        <stop offset=".995" />
+      </linearGradient>
+      <clipPath id="clip0_337_7902">
+        <path fill="#fff" d="M0 0h267v164H0z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default NodejsStackedBlack;

components/Icons/Logos/NodejsStackedDark.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const NodejsStackedDark: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="289"
+    height="177"
+    viewBox="0 0 289 177"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_337_7900)">
+      <mask
+        id="mask0_337_7900"
+        style={{ maskType: 'luminance' }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="289"
+        height="177"
+      >
+        <path d="M289 0H0v177h289V0Z" fill="#fff" />
+      </mask>
+      <g mask="url(#mask0_337_7900)">
+        <path
+          d="M142.802 177c-.98 0-1.895-.261-2.744-.719l-8.688-5.161c-1.307-.719-.653-.98-.262-1.111 1.764-.588 2.091-.719 3.92-1.764.196-.131.457-.066.653.065l6.663 3.986c.262.13.588.13.784 0l26.065-15.093c.262-.131.392-.392.392-.719v-30.121c0-.326-.13-.588-.392-.718l-26.065-15.028c-.261-.131-.588-.131-.784 0l-26.064 15.028c-.262.13-.392.457-.392.718v30.121c0 .261.13.588.392.719l7.12 4.116c3.854 1.96 6.271-.327 6.271-2.614v-29.728c0-.392.327-.784.784-.784h3.332c.392 0 .784.326.784.784v29.728c0 5.162-2.809 8.168-7.709 8.168-1.502 0-2.678 0-6.01-1.634l-6.859-3.92a5.515 5.515 0 0 1-2.743-4.77v-30.12a5.514 5.514 0 0 1 2.743-4.77l26.065-15.093c1.633-.915 3.854-.915 5.487 0l26.065 15.093a5.513 5.513 0 0 1 2.744 4.77v30.12c0 1.96-1.045 3.79-2.744 4.77l-26.065 15.093c-.784.327-1.763.588-2.743.588Z"
+          fill="#5FA04E"
+        />
+        <path
+          d="M150.902 156.288c-11.432 0-13.784-5.227-13.784-9.67 0-.392.327-.784.784-.784h3.397c.392 0 .719.261.719.653.522 3.463 2.025 5.162 8.949 5.162 5.488 0 7.839-1.241 7.839-4.182 0-1.698-.653-2.94-9.211-3.789-7.12-.719-11.562-2.287-11.562-7.971 0-5.293 4.442-8.429 11.889-8.429 8.362 0 12.477 2.875 13 9.147 0 .196-.066.392-.196.588-.131.131-.327.262-.523.262h-3.462a.767.767 0 0 1-.719-.588c-.784-3.594-2.809-4.77-8.165-4.77-6.01 0-6.729 2.091-6.729 3.659 0 1.895.849 2.483 8.95 3.528 8.035 1.045 11.824 2.548 11.824 8.167 0 5.75-4.769 9.017-13 9.017ZM188.529 124.664c0 2.745-2.286 5.031-5.03 5.031-2.743 0-5.03-2.221-5.03-5.031 0-2.874 2.352-5.031 5.03-5.031 2.679 0 5.03 2.222 5.03 5.031Zm-9.276 0c0 2.353 1.895 4.247 4.181 4.247 2.352 0 4.246-1.96 4.246-4.247 0-2.352-1.894-4.181-4.246-4.181-2.221 0-4.181 1.829-4.181 4.181Zm2.352-2.809h1.96c.653 0 1.959 0 1.959 1.503 0 1.045-.653 1.241-1.045 1.372.784.065.849.588.915 1.307.065.457.13 1.241.261 1.502h-1.176c0-.261-.196-1.698-.196-1.764-.065-.326-.196-.457-.588-.457h-.98v2.287h-1.11v-5.75Zm1.045 2.483h.849c.719 0 .85-.523.85-.784 0-.784-.523-.784-.85-.784h-.914v1.568h.065Z"
+          fill="#5FA04E"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M61.994 59.196a3.324 3.324 0 0 0-1.699-2.875L32.663 40.313c-.457-.26-.98-.392-1.503-.457H30.9c-.523 0-1.045.196-1.503.457L1.698 56.256A3.35 3.35 0 0 0 0 59.196l.065 42.862c0 .588.327 1.176.85 1.437.522.327 1.175.327 1.633 0l16.462-9.409a3.324 3.324 0 0 0 1.698-2.874v-20.06c0-1.175.653-2.286 1.699-2.874l6.99-4.051c.522-.327 1.11-.457 1.698-.457.588 0 1.176.13 1.633.457l6.99 4.051a3.324 3.324 0 0 1 1.698 2.875V91.21c0 1.177.654 2.287 1.699 2.875l16.331 9.409a1.593 1.593 0 0 0 1.699 0c.522-.261.849-.849.849-1.437V59.196ZM195.127.196c-.522-.261-1.176-.261-1.633 0-.522.327-.849.85-.849 1.437v42.47c0 .392-.196.784-.588 1.045a1.25 1.25 0 0 1-1.176 0l-6.924-3.985a3.367 3.367 0 0 0-3.332 0L152.927 57.17a3.325 3.325 0 0 0-1.698 2.874v31.95c0 1.177.653 2.287 1.698 2.875l27.698 16.008a3.367 3.367 0 0 0 3.332 0l27.698-16.008a3.324 3.324 0 0 0 1.698-2.874V12.349a3.35 3.35 0 0 0-1.698-2.94L195.127.196Zm-2.547 81.28c0 .327-.131.588-.392.719l-9.473 5.488a.968.968 0 0 1-.849 0l-9.472-5.488c-.261-.13-.392-.457-.392-.719V70.5c0-.326.131-.588.392-.718l9.472-5.489a.968.968 0 0 1 .849 0l9.473 5.489c.261.13.392.457.392.718v10.977ZM287.301 70.238c1.046-.588 1.634-1.699 1.634-2.875v-7.775a3.404 3.404 0 0 0-1.634-2.875l-27.502-15.942a3.365 3.365 0 0 0-3.331 0L228.77 56.779a3.325 3.325 0 0 0-1.699 2.874v31.95c0 1.177.654 2.287 1.699 2.875l27.502 15.681c1.045.589 2.286.589 3.266 0l16.658-9.277c.523-.262.849-.85.849-1.438s-.326-1.176-.849-1.437l-27.829-16.008c-.522-.327-.849-.85-.849-1.438v-9.996c0-.588.327-1.176.849-1.438l8.689-4.965a1.593 1.593 0 0 1 1.698 0l8.688 4.965c.523.327.85.85.85 1.438v7.84c0 .588.326 1.176.849 1.438a1.594 1.594 0 0 0 1.698 0l16.462-9.605Z"
+          fill="#333"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M257.709 68.735a.593.593 0 0 1 .653 0l5.291 3.071c.196.13.327.327.327.588v6.142a.686.686 0 0 1-.327.588l-5.291 3.07a.593.593 0 0 1-.653 0l-5.292-3.07a.685.685 0 0 1-.326-.588v-6.142c0-.261.13-.457.326-.588l5.292-3.07Z"
+          fill="#5FA04E"
+        />
+        <path
+          d="M108.31 40.901a3.367 3.367 0 0 0-3.332 0L77.476 56.778c-1.045.589-1.633 1.7-1.633 2.875v31.82c0 1.176.653 2.287 1.633 2.875l27.502 15.877a3.367 3.367 0 0 0 3.332 0l27.502-15.877c1.045-.588 1.633-1.7 1.633-2.875v-31.82a3.406 3.406 0 0 0-1.633-2.874L108.31 40.9Z"
+          fill="url(#paint0_linear_337_7900)"
+        />
+        <path
+          d="M135.877 56.779 108.244 40.9a4.543 4.543 0 0 0-.849-.326L76.5 93.5c.261.327.673.804 1 1l27.478 15.725c.784.457 1.698.588 2.548.326l29.069-53.184a2.044 2.044 0 0 0-.718-.588Z"
+          fill="url(#paint1_linear_337_7900)"
+        />
+        <path
+          d="m104.063 35.086-.392.196h.523l-.131-.196Z"
+          fill="url(#paint2_linear_337_7900)"
+        />
+        <path
+          d="M135.809 94.348c.784-.458 1.491-1.315 1.491-2.348l-30.104-51.49c-.784-.131-1.633-.066-2.352.391L77.408 56.713 107 110.682a4.54 4.54 0 0 0 1.241-.392l27.568-15.942Z"
+          fill="url(#paint3_linear_337_7900)"
+        />
+      </g>
+    </g>
+    <defs>
+      <linearGradient
+        id="paint0_linear_337_7900"
+        x1="117.844"
+        y1="52.726"
+        x2="92.971"
+        y2="103.459"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#3F873F" />
+        <stop offset=".33" stopColor="#3F8B3D" />
+        <stop offset=".637" stopColor="#3E9638" />
+        <stop offset=".934" stopColor="#3DA92E" />
+        <stop offset="1" stopColor="#3DAE2B" />
+      </linearGradient>
+      <linearGradient
+        id="paint1_linear_337_7900"
+        x1="102.464"
+        y1="79.278"
+        x2="172.246"
+        y2="27.73"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset=".138" stopColor="#3F873F" />
+        <stop offset=".402" stopColor="#52A044" />
+        <stop offset=".713" stopColor="#64B749" />
+        <stop offset=".908" stopColor="#6ABF4B" />
+      </linearGradient>
+      <linearGradient
+        id="paint2_linear_337_7900"
+        x1="74.834"
+        y1="35.163"
+        x2="138.473"
+        y2="35.163"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset=".092" stopColor="#6ABF4B" />
+        <stop offset=".287" stopColor="#64B749" />
+        <stop offset=".598" stopColor="#52A044" />
+        <stop offset=".862" stopColor="#3F873F" />
+      </linearGradient>
+      <linearGradient
+        id="paint3_linear_337_7900"
+        x1="74.835"
+        y1="75.553"
+        x2="138.473"
+        y2="75.553"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset=".092" stopColor="#6ABF4B" />
+        <stop offset=".287" stopColor="#64B749" />
+        <stop offset=".598" stopColor="#52A044" />
+        <stop offset=".862" stopColor="#3F873F" />
+      </linearGradient>
+      <clipPath id="clip0_337_7900">
+        <path fill="#fff" d="M0 0h289v177H0z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default NodejsStackedDark;

components/Icons/Logos/NodejsStackedLight.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const NodejsStackedLight: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="319"
+    height="195"
+    viewBox="0 0 319 195"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_337_7901)">
+      <mask
+        id="mask0_337_7901"
+        style={{ maskType: 'luminance' }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="319"
+        height="195"
+      >
+        <path d="M319 0H0V195H319V0Z" fill="white" />
+      </mask>
+      <g mask="url(#mask0_337_7901)">
+        <path
+          d="M157.625 195C156.544 195 155.534 194.712 154.597 194.208L145.007 188.522C143.565 187.73 144.286 187.442 144.718 187.298C146.665 186.65 147.026 186.506 149.045 185.354C149.261 185.21 149.549 185.282 149.766 185.426L157.121 189.817C157.409 189.961 157.77 189.961 157.986 189.817L186.756 173.189C187.045 173.045 187.189 172.757 187.189 172.398V139.214C187.189 138.854 187.045 138.566 186.756 138.422L157.986 121.866C157.697 121.722 157.337 121.722 157.121 121.866L128.35 138.422C128.062 138.566 127.917 138.926 127.917 139.214V172.398C127.917 172.686 128.062 173.045 128.35 173.189L136.21 177.724C140.464 179.884 143.132 177.364 143.132 174.845V142.093C143.132 141.661 143.492 141.229 143.997 141.229H147.675C148.107 141.229 148.54 141.589 148.54 142.093V174.845C148.54 180.532 145.439 183.843 140.031 183.843C138.373 183.843 137.075 183.843 133.398 182.043L125.826 177.724C123.952 176.645 122.798 174.629 122.798 172.47V139.286C122.798 137.126 123.952 135.111 125.826 134.031L154.597 117.403C156.4 116.395 158.851 116.395 160.654 117.403L189.424 134.031C191.299 135.111 192.453 137.126 192.453 139.286V172.47C192.453 174.629 191.299 176.645 189.424 177.724L160.654 194.352C159.789 194.712 158.707 195 157.625 195Z"
+          fill="#5FA04E"
+        />
+        <path
+          d="M166.567 172.182C153.948 172.182 151.352 166.423 151.352 161.528C151.352 161.096 151.713 160.664 152.217 160.664H155.967C156.4 160.664 156.76 160.952 156.76 161.384C157.337 165.199 158.995 167.071 166.639 167.071C172.696 167.071 175.291 165.703 175.291 162.464C175.291 160.592 174.57 159.225 165.124 158.289C157.265 157.497 152.362 155.77 152.362 149.507C152.362 143.677 157.265 140.221 165.485 140.221C174.715 140.221 179.257 143.389 179.834 150.299C179.834 150.515 179.762 150.731 179.618 150.947C179.474 151.091 179.257 151.235 179.041 151.235H175.219C174.859 151.235 174.498 150.947 174.426 150.587C173.561 146.628 171.326 145.332 165.413 145.332C158.779 145.332 157.986 147.636 157.986 149.363C157.986 151.451 158.923 152.099 167.864 153.25C176.734 154.402 180.916 156.058 180.916 162.248C180.916 168.583 175.652 172.182 166.567 172.182Z"
+          fill="#5FA04E"
+        />
+        <path
+          d="M208.1 137.342C208.1 140.365 205.576 142.885 202.548 142.885C199.519 142.885 196.996 140.437 196.996 137.342C196.996 134.175 199.591 131.8 202.548 131.8C205.504 131.8 208.1 134.247 208.1 137.342ZM197.861 137.342C197.861 139.934 199.952 142.021 202.476 142.021C205.072 142.021 207.163 139.862 207.163 137.342C207.163 134.751 205.072 132.735 202.476 132.735C200.024 132.735 197.861 134.751 197.861 137.342ZM200.457 134.247H202.62C203.341 134.247 204.783 134.247 204.783 135.903C204.783 137.054 204.062 137.27 203.629 137.414C204.495 137.486 204.567 138.062 204.639 138.854C204.711 139.358 204.783 140.221 204.927 140.509H203.629C203.629 140.221 203.413 138.638 203.413 138.566C203.341 138.206 203.197 138.062 202.764 138.062H201.683V140.581H200.457V134.247ZM201.61 136.982H202.548C203.341 136.982 203.485 136.406 203.485 136.118C203.485 135.255 202.908 135.255 202.548 135.255H201.538V136.982H201.61Z"
+          fill="#5FA04E"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M68.4293 65.2159C68.4293 63.9203 67.7082 62.6966 66.5545 62.0487L36.0533 44.4131C35.5486 44.1251 34.9717 43.9812 34.3949 43.9092C34.3228 43.9092 34.1065 43.9092 34.1065 43.9092C33.5296 43.9092 32.9528 44.1251 32.448 44.4131L1.87477 61.9767C0.721067 62.6246 0 63.8483 0 65.2159L0.0721067 112.436C0.0721067 113.084 0.43264 113.732 1.00949 114.02C1.58635 114.38 2.30741 114.38 2.81216 114.02L20.983 103.654C22.1368 103.007 22.8578 101.783 22.8578 100.487V78.3887C22.8578 77.093 23.5789 75.8693 24.7326 75.2215L32.448 70.7586C33.0249 70.3987 33.6738 70.2547 34.3228 70.2547C34.9717 70.2547 35.6207 70.3987 36.1255 70.7586L43.8409 75.2215C44.9946 75.8693 45.7156 77.093 45.7156 78.3887V100.487C45.7156 101.783 46.4367 103.007 47.5904 103.654L65.6171 114.02C66.1939 114.38 66.915 114.38 67.4919 114.02C68.0687 113.732 68.4293 113.084 68.4293 112.436V65.2159Z"
+          fill="white"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M215.382 0.215947C214.806 -0.0719823 214.085 -0.0719823 213.58 0.215947C213.003 0.575858 212.642 1.15172 212.642 1.79956V48.588C212.642 49.0199 212.426 49.4518 211.993 49.7398C211.561 49.9557 211.128 49.9557 210.696 49.7398L203.052 45.3488C201.899 44.701 200.528 44.701 199.375 45.3488L168.802 62.9845C167.648 63.6323 166.927 64.856 166.927 66.1517V101.351C166.927 102.647 167.648 103.87 168.802 104.518L199.375 122.154C200.528 122.802 201.899 122.802 203.052 122.154L233.625 104.518C234.779 103.87 235.5 102.647 235.5 101.351V13.6047C235.5 12.237 234.779 11.0133 233.625 10.3654L215.382 0.215947ZM212.57 89.7619C212.57 90.1218 212.426 90.4098 212.138 90.5537L201.682 96.6002C201.394 96.7442 201.033 96.7442 200.745 96.6002L190.289 90.5537C190.001 90.4098 189.857 90.0498 189.857 89.7619V77.6689C189.857 77.309 190.001 77.021 190.289 76.8771L200.745 70.8306C201.033 70.6866 201.394 70.6866 201.682 70.8306L212.138 76.8771C212.426 77.021 212.57 77.381 212.57 77.6689V89.7619Z"
+          fill="white"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M317.125 77.3809C318.279 76.7331 318.928 75.5094 318.928 74.2137V65.6478C318.928 64.3522 318.207 63.1285 317.125 62.4806L286.769 44.9169C285.615 44.2691 284.245 44.2691 283.091 44.9169L252.518 62.5526C251.364 63.2004 250.643 64.4241 250.643 65.7198V100.919C250.643 102.215 251.364 103.439 252.518 104.086L282.875 121.362C284.028 122.01 285.398 122.01 286.48 121.362L304.867 111.141C305.444 110.853 305.805 110.205 305.805 109.557C305.805 108.909 305.444 108.261 304.867 107.973L274.15 90.3378C273.573 89.9778 273.212 89.402 273.212 88.7542V77.7409C273.212 77.093 273.573 76.4452 274.15 76.1573L283.74 70.6866C284.317 70.3267 285.038 70.3267 285.615 70.6866L295.205 76.1573C295.782 76.5172 296.142 77.093 296.142 77.7409V86.3787C296.142 87.0266 296.503 87.6744 297.08 87.9623C297.657 88.3223 298.378 88.3223 298.955 87.9623L317.125 77.3809Z"
+          fill="white"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M284.461 75.7253C284.677 75.5814 284.966 75.5814 285.182 75.7253L291.023 79.1085C291.239 79.2525 291.383 79.4684 291.383 79.7564V86.5227C291.383 86.8106 291.239 87.0266 291.023 87.1705L285.182 90.5537C284.966 90.6977 284.677 90.6977 284.461 90.5537L278.62 87.1705C278.404 87.0266 278.26 86.8106 278.26 86.5227V79.7564C278.26 79.4684 278.404 79.2525 278.62 79.1085L284.461 75.7253Z"
+          fill="#5FA04E"
+        />
+        <path
+          d="M119.445 44.5068C118.271 43.8467 116.878 43.8467 115.705 44.5068L84.8332 62.3292C83.6599 62.9892 83 64.2361 83 65.5563V101.275C83 102.595 83.7332 103.841 84.8332 104.502L115.705 122.324C116.878 122.984 118.271 122.984 119.445 122.324L150.317 104.502C151.49 103.841 152.15 102.595 152.15 101.275V65.5563C152.15 64.2361 151.416 62.9892 150.317 62.3292L119.445 44.5068Z"
+          fill="url(#paint0_linear_337_7901)"
+        />
+        <path
+          d="M150.39 62.3292L119.371 44.5067C119.078 44.3601 118.711 44.2134 118.418 44.14L83.7378 103.55C84.0311 103.917 84.4937 104.452 84.8603 104.672L115.705 122.324C116.585 122.837 117.611 122.984 118.565 122.69L151.196 62.9892C150.976 62.6959 150.683 62.4759 150.39 62.3292Z"
+          fill="url(#paint1_linear_337_7901)"
+        />
+        <path
+          d="M150.314 104.502C151.194 103.988 151.987 103.026 151.987 101.866L118.195 44.0667C117.315 43.92 116.362 43.9934 115.555 44.5068L84.7567 62.2559L117.975 122.837C118.415 122.764 118.928 122.617 119.368 122.397L150.314 104.502Z"
+          fill="url(#paint2_linear_337_7901)"
+        />
+      </g>
+    </g>
+    <defs>
+      <linearGradient
+        id="paint0_linear_337_7901"
+        x1="130.147"
+        y1="57.7802"
+        x2="102.227"
+        y2="114.729"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#3F873F" />
+        <stop offset="0.3296" stopColor="#3F8B3D" />
+        <stop offset="0.6367" stopColor="#3E9638" />
+        <stop offset="0.9341" stopColor="#3DA92E" />
+        <stop offset="1" stopColor="#3DAE2B" />
+      </linearGradient>
+      <linearGradient
+        id="paint1_linear_337_7901"
+        x1="112.883"
+        y1="87.586"
+        x2="191.215"
+        y2="29.7213"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset="0.1376" stopColor="#3F873F" />
+        <stop offset="0.4016" stopColor="#52A044" />
+        <stop offset="0.7129" stopColor="#64B749" />
+        <stop offset="0.9081" stopColor="#6ABF4B" />
+      </linearGradient>
+      <linearGradient
+        id="paint2_linear_337_7901"
+        x1="81.8683"
+        y1="83.4042"
+        x2="153.304"
+        y2="83.4042"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset="0.0919165" stopColor="#6ABF4B" />
+        <stop offset="0.2871" stopColor="#64B749" />
+        <stop offset="0.5984" stopColor="#52A044" />
+        <stop offset="0.8624" stopColor="#3F873F" />
+      </linearGradient>
+      <clipPath id="clip0_337_7901">
+        <rect width="319" height="195" fill="white" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default NodejsStackedLight;

components/Icons/Logos/NodejsStackedWhite.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const NodejsStackedWhite: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="320"
+    height="196"
+    viewBox="0 0 320 196"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_337_7903)">
+      <mask
+        id="mask0_337_7903"
+        style={{ maskType: 'luminance' }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="320"
+        height="196"
+      >
+        <path d="M320 0H0v196h320V0Z" fill="#fff" />
+      </mask>
+      <g mask="url(#mask0_337_7903)">
+        <path
+          d="M158.119 196c-1.085 0-2.097-.289-3.038-.796l-9.62-5.716c-1.447-.795-.723-1.085-.289-1.23 1.953-.651 2.314-.795 4.34-1.953.217-.145.506-.072.723.072l7.378 4.414c.289.144.651.144.868 0l28.861-16.713c.289-.145.434-.435.434-.796v-33.354c0-.362-.145-.652-.434-.796l-28.861-16.641c-.289-.145-.651-.145-.868 0l-28.861 16.641c-.289.144-.434.506-.434.796v33.354c0 .289.145.651.434.796l7.884 4.558c4.268 2.17 6.944-.362 6.944-2.894v-32.92c0-.434.362-.869.868-.869h3.689a.88.88 0 0 1 .868.869v32.92c0 5.715-3.11 9.044-8.535 9.044-1.664 0-2.966 0-6.654-1.809l-7.595-4.341a6.107 6.107 0 0 1-3.038-5.282V140a6.107 6.107 0 0 1 3.038-5.282l28.86-16.713c1.809-1.013 4.268-1.013 6.076 0l28.861 16.713a6.107 6.107 0 0 1 3.038 5.282v33.354a6.107 6.107 0 0 1-3.038 5.282l-28.861 16.713c-.868.362-1.953.651-3.038.651Z"
+          fill="#fff"
+        />
+        <path
+          d="M167.088 173.065c-12.658 0-15.262-5.789-15.262-10.708 0-.435.362-.869.868-.869h3.761c.434 0 .796.29.796.724.579 3.834 2.242 5.716 9.91 5.716 6.076 0 8.68-1.375 8.68-4.631 0-1.881-.724-3.256-10.199-4.196-7.885-.796-12.803-2.533-12.803-8.827 0-5.861 4.918-9.333 13.164-9.333 9.259 0 13.816 3.183 14.395 10.129 0 .217-.073.434-.217.651-.145.145-.362.289-.579.289h-3.834a.847.847 0 0 1-.795-.651c-.868-3.979-3.111-5.282-9.042-5.282-6.655 0-7.45 2.316-7.45 4.052 0 2.098.94 2.75 9.909 3.907 8.897 1.158 13.093 2.822 13.093 9.044 0 6.367-5.281 9.985-14.395 9.985ZM208.752 138.047c0 3.038-2.532 5.571-5.57 5.571-3.038 0-5.569-2.46-5.569-5.571 0-3.184 2.604-5.572 5.569-5.572 2.966 0 5.57 2.46 5.57 5.572Zm-10.271 0c0 2.604 2.097 4.702 4.629 4.702 2.604 0 4.702-2.17 4.702-4.702 0-2.605-2.098-4.631-4.702-4.631-2.459 0-4.629 2.026-4.629 4.631Zm2.604-3.112h2.17c.723 0 2.17 0 2.17 1.664 0 1.158-.724 1.375-1.158 1.52.868.072.941.651 1.013 1.447.072.506.145 1.375.289 1.664h-1.302c0-.289-.217-1.881-.217-1.954-.072-.361-.217-.506-.651-.506h-1.085v2.532h-1.229v-6.367Zm1.157 2.75h.94c.796 0 .941-.579.941-.868 0-.869-.579-.869-.941-.869h-1.012v1.737h.072Z"
+          fill="#fff"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M68.644 65.55a3.681 3.681 0 0 0-1.88-3.183L36.165 44.64c-.506-.29-1.085-.434-1.663-.507h-.29c-.578 0-1.157.217-1.663.507L1.88 62.295A3.71 3.71 0 0 0 0 65.55l.072 47.463c0 .651.362 1.302.94 1.592.58.361 1.303.361 1.809 0l18.228-10.419a3.68 3.68 0 0 0 1.88-3.183V78.791c0-1.303.724-2.533 1.881-3.184l7.74-4.486c.578-.361 1.23-.506 1.88-.506.651 0 1.302.145 1.809.506l7.74 4.486a3.681 3.681 0 0 1 1.88 3.184v22.212a3.68 3.68 0 0 0 1.88 3.183l18.084 10.419a1.768 1.768 0 0 0 1.88 0c.58-.29.94-.941.94-1.592V65.55ZM216.058.217c-.579-.29-1.302-.29-1.809 0-.578.362-.94.94-.94 1.592v47.028c0 .434-.217.868-.651 1.158a1.383 1.383 0 0 1-1.302 0l-7.667-4.414a3.727 3.727 0 0 0-3.689 0l-30.669 17.726a3.682 3.682 0 0 0-1.881 3.184v35.38c0 1.302.724 2.532 1.881 3.183L200 122.78a3.723 3.723 0 0 0 3.689 0l30.669-17.726a3.682 3.682 0 0 0 1.881-3.183V13.674a3.711 3.711 0 0 0-1.881-3.255L216.058.217Zm-2.821 90.005c0 .362-.145.651-.434.796l-10.488 6.078c-.29.144-.651.144-.941 0l-10.488-6.078c-.289-.145-.434-.506-.434-.796V78.067c0-.362.145-.651.434-.796l10.488-6.077c.29-.145.651-.145.941 0l10.488 6.077c.289.145.434.507.434.796v12.155ZM318.119 77.778c1.158-.651 1.809-1.881 1.809-3.184v-8.61a3.77 3.77 0 0 0-1.809-3.183l-30.452-17.654a3.727 3.727 0 0 0-3.689 0l-30.669 17.726a3.681 3.681 0 0 0-1.88 3.184v35.38a3.68 3.68 0 0 0 1.88 3.183l30.452 17.365c1.158.651 2.532.651 3.617 0l18.445-10.274c.579-.29.94-.941.94-1.592 0-.651-.361-1.302-.94-1.592l-30.814-17.726c-.578-.362-.94-.94-.94-1.592V78.14c0-.65.362-1.302.94-1.591l9.62-5.499a1.766 1.766 0 0 1 1.881 0l9.62 5.499c.579.362.941.94.941 1.591v8.683c0 .65.361 1.302.94 1.591a1.766 1.766 0 0 0 1.881 0l18.227-10.635Z"
+          fill="#fff"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M285.353 76.114a.656.656 0 0 1 .723 0l5.859 3.4a.76.76 0 0 1 .362.651v6.801a.76.76 0 0 1-.362.652l-5.859 3.4a.656.656 0 0 1-.723 0l-5.859-3.4a.76.76 0 0 1-.362-.652v-6.8a.76.76 0 0 1 .362-.652l5.859-3.4Z"
+          fill="#fff"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M116.023 45.51a3.727 3.727 0 0 1 3.689 0l30.379 17.58c1.158.652 1.809 1.882 1.809 3.184v35.018a3.77 3.77 0 0 1-1.809 3.184l-30.379 17.581a3.728 3.728 0 0 1-3.689 0l-30.38-17.581c-1.157-.651-1.808-1.881-1.808-3.184v-35.09a3.77 3.77 0 0 1 1.808-3.183l30.38-17.51Z"
+          fill="url(#paint0_linear_337_7903)"
+        />
+        <path
+          opacity=".66"
+          d="m149.946 63.018-30.235-17.581a5.042 5.042 0 0 0-.94-.362l-34.214 58.532c.29.362.651.651 1.013.868l30.452 17.582c.94.506 1.953.651 2.893.289l31.971-58.532a2.611 2.611 0 0 0-.94-.796Z"
+          fill="#4B4B4B"
+        />
+        <path
+          d="m119.638 122.057 30.308-17.582c1.157-.651 1.663-1.881 1.663-3.183v-.145L118.77 45.075c-.94-.29-1.953-.145-2.821.362L85.859 62.8l32.694 59.618c.434-.073.796-.145 1.085-.362Z"
+          fill="url(#paint1_linear_337_7903)"
+        />
+      </g>
+    </g>
+    <defs>
+      <linearGradient
+        id="paint0_linear_337_7903"
+        x1="83.828"
+        y1="83.773"
+        x2="151.968"
+        y2="83.773"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset=".005" stopColor="#fff" />
+        <stop offset=".194" stopColor="#E8E8E8" />
+        <stop offset=".542" stopColor="#C2C2C2" />
+        <stop offset=".824" stopColor="#ABABAB" />
+        <stop offset="1" stopColor="#A3A3A3" />
+      </linearGradient>
+      <linearGradient
+        id="paint1_linear_337_7903"
+        x1="83.356"
+        y1="83.723"
+        x2="153.647"
+        y2="83.723"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#A3A3A3" />
+        <stop offset=".176" stopColor="#ABABAB" />
+        <stop offset=".458" stopColor="#C2C2C2" />
+        <stop offset=".806" stopColor="#E8E8E8" />
+        <stop offset=".995" stopColor="#fff" />
+      </linearGradient>
+      <clipPath id="clip0_337_7903">
+        <path fill="#fff" d="M0 0h320v196H0z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default NodejsStackedWhite;

components/Icons/NodejsLogoDark.tsx components/Icons/Logos/NodejsDark.tsx

···
-import type { FC, HTMLAttributes } from 'react';
+import type { FC, SVGProps } from 'react';
 
-const NodejsLogoDark: FC<HTMLAttributes<SVGElement>> = props => (
+const NodejsDark: FC<SVGProps<SVGSVGElement>> = props => (
   <svg
     width="267"
     height="80"
···
   </svg>
 );
 
-export default NodejsLogoDark;
+export default NodejsDark;

components/Icons/NodejsLogoLight.tsx components/Icons/Logos/NodejsLight.tsx

···
-import type { FC, HTMLAttributes } from 'react';
+import type { FC, SVGProps } from 'react';
 
-const NodejsLogoLight: FC<HTMLAttributes<SVGElement>> = props => (
+const NodejsLight: FC<SVGProps<SVGSVGElement>> = props => (
   <svg
     width="267"
     height="80"
···
   </svg>
 );
 
-export default NodejsLogoLight;
+export default NodejsLight;

components/Icons/Platform/Apple.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Apple: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M30 16c0 7.728-6.265 14-14 14S2 23.728 2 16C2 8.265 8.265 2 16 2s14 6.265 14 14Z"
+      fill="#283544"
+    />
+    <path
+      d="M22.562 12.457c-.076.045-1.895.986-1.895 3.07.086 2.38 2.295 3.213 2.333 3.213-.038.045-.334 1.136-1.21 2.28-.694.986-1.466 1.98-2.637 1.98-1.114 0-1.514-.657-2.8-.657-1.381 0-1.772.657-2.829.657-1.171 0-2-1.047-2.733-2.023-.952-1.278-1.761-3.284-1.79-5.21-.02-1.02.19-2.023.724-2.875.752-1.19 2.095-1.997 3.561-2.023 1.124-.036 2.124.719 2.81.719.657 0 1.885-.72 3.275-.72.6.001 2.2.17 3.191 1.59Zm-6.561-1.792c-.2-.932.352-1.864.866-2.458.657-.72 1.695-1.207 2.59-1.207a3.334 3.334 0 0 1-.952 2.511c-.58.72-1.58 1.26-2.504 1.154Z"
+      fill="#fff"
+    />
+  </svg>
+);
+
+export default Apple;

components/Icons/Platform/Generic.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Generic: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M16 29.333c7.364 0 13.333-5.97 13.333-13.333 0-7.364-5.97-13.334-13.333-13.334C8.636 2.666 2.667 8.636 2.667 16S8.637 29.333 16 29.333Z"
+      stroke="#000"
+      strokeWidth="2.667"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);
+
+export default Generic;

components/Icons/Platform/Homebrew.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Homebrew: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_429_2384)">
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M14.175 5.943c.087-2.773-.847-4.408-3.533-5.488-.763 2.67 2.388 5.132 3.533 5.488Z"
+        fill="#D1D3D4"
+        stroke="#000"
+        strokeWidth=".566"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M21.458 10.643c.088-2.277-.488-3.196-.92-3.853-.437-.614-1.488-1.577-2.78-1.617-1.22-.039-1.514.636-2.64.677-.185-2.051 1.363-3.177 1.363-3.177s-.424-.598-.774-.745c-.504.448-1.89 1.941-1.57 3.863-1.036-.198-1.767-.792-2.856-.578-1.484.292-2.706 1.19-3.403 3.157-.697 1.968.246 4.264.45 4.92.206.656 1.723 3.444 2.912 3.854 1.188.41 1.189.225 1.824-.02.636-.247 1.6-.697 3.014-.185 1.414.512 1.599.635 2.48.061.882-.573 2.03-2.357 2.296-2.87.266-.512.41-.778.492-1.045.857-.427.033-.4.112-2.442Z"
+        fill="#D1D3D4"
+        stroke="#000"
+        strokeWidth=".566"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M23.76 27.287a2.128 2.128 0 0 0 2.133-2.125v-7.656a2.126 2.126 0 0 0-2.125-2.126h-1.753a.473.473 0 0 1-.472-.472v-1.113H7.724l.035 16.32a.472.472 0 0 0 .218.397c.616.357 2.589 1.034 6.732 1.034 4.23 0 6.12-.907 6.662-1.316a.471.471 0 0 0 .17-.361c.002-.452.002-1.498.002-2.117a.471.471 0 0 1 .482-.472c.52.007 1.143.008 1.735.007Zm-2.217-9.424a.591.591 0 0 1 .59-.59h1.505a.59.59 0 0 1 .59.59v6.87a.59.59 0 0 1-.59.591h-1.504a.591.591 0 0 1-.59-.59v-6.87Z"
+        fill="#fff"
+        stroke="#000"
+        strokeWidth=".566"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M9.086 13.658v14.64c0 .17.09.325.237.41.598.284 2.331.964 5.37.964 3.06 0 4.743-.826 5.306-1.166a.47.47 0 0 0 .216-.396V13.658H9.087Z"
+        fill="#FBB040"
+      />
+      <path
+        d="M10.722 16.137v11.314"
+        stroke="#FFDB96"
+        strokeWidth="1.302"
+        strokeLinecap="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.01 16.662a.82.82 0 0 0-.367-.66 1.975 1.975 0 0 1-.82-.98c-3.022.102-5.78-.429-7.17-.803a11.605 11.605 0 0 0-1.082-.252 1.814 1.814 0 0 1-1.464-1.773c0-.967.767-1.752 1.725-1.787a2.189 2.189 0 1 1 4.217 1.117l.006.002a2.095 2.095 0 0 1 3.985-.016 2.277 2.277 0 0 1 4.436-.918l.199-.05a1.789 1.789 0 1 1 1.122 3.33 2.637 2.637 0 0 0-.578.15c-.518.195-1.048.357-1.584.491a1.964 1.964 0 0 1-.225.736 2.447 2.447 0 0 0-.281 1.33v.201c0 .585-.474.941-1.06.941a1.06 1.06 0 0 1-1.059-1.06Z"
+        fill="#fff"
+        stroke="#000"
+        strokeWidth=".566"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_429_2384">
+        <path fill="#fff" d="M5.373 0h21.255v32H5.373z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default Homebrew;

components/Icons/Platform/Linux.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Linux: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g id="Type=ubuntu">
+      <path
+        id="bg"
+        d="M30 16C30 23.728 23.735 30 16 30C8.265 30 2 23.728 2 16C2 8.265 8.265 2 16 2C23.735 2 30 8.265 30 16Z"
+        fill="#E95420"
+      />
+      <path
+        id="ubuntu"
+        d="M6.82154 14.1563C5.81185 14.1563 5 14.9865 5 16.0035C5 17.0205 5.81867 17.8507 6.82154 17.8507C7.82442 17.8507 8.64309 17.0205 8.64309 16.0035C8.64309 14.9795 7.82442 14.1563 6.82154 14.1563ZM19.8316 22.5482C18.9583 23.0602 18.665 24.1879 19.163 25.0734C19.6679 25.959 20.7799 26.2634 21.6531 25.7514C22.5264 25.2395 22.8197 24.1118 22.3217 23.2262C21.8101 22.3476 20.698 22.0432 19.8316 22.5482ZM10.7785 16.0035C10.7785 14.177 11.6722 12.565 13.0434 11.5896L11.7131 9.32725C10.1167 10.4065 8.93645 12.06 8.43842 13.9902C9.01149 14.4676 9.37989 15.194 9.37989 16.0035C9.37989 16.8129 9.01149 17.5393 8.43842 18.0167C8.92962 19.9469 10.1167 21.6004 11.7131 22.6797L13.0434 20.4174C11.6722 19.4419 10.7785 17.8299 10.7785 16.0035ZM16.0998 10.6071C18.8833 10.6071 21.1619 12.7657 21.4007 15.5261L24 15.4846C23.8704 13.4506 22.9971 11.6241 21.6463 10.282C20.9504 10.5449 20.1522 10.5034 19.4632 10.1021C18.7673 9.69393 18.3375 9.01593 18.2147 8.26875C17.5393 8.08195 16.8298 7.97817 16.0998 7.97817C14.8377 7.97817 13.6506 8.27566 12.5932 8.80838L13.8621 11.1053C14.5375 10.787 15.3016 10.6071 16.0998 10.6071ZM16.0998 21.3998C15.3016 21.3998 14.5375 21.2199 13.8553 20.9017L12.5864 23.1985C13.6438 23.7313 14.8377 24.0287 16.093 24.0287C16.823 24.0287 17.5325 23.925 18.2079 23.7382C18.3239 22.9979 18.7605 22.313 19.4564 21.9048C20.1454 21.4966 20.9504 21.462 21.6395 21.7249C22.9835 20.3828 23.8636 18.5563 23.9932 16.5223L21.3939 16.4808C21.1619 19.2343 18.8833 21.3998 16.0998 21.3998ZM19.8248 9.45178C20.698 9.96374 21.8101 9.65933 22.3149 8.77378C22.8197 7.88824 22.5196 6.76054 21.6463 6.24859C20.7731 5.73663 19.661 6.04104 19.1562 6.92659C18.6582 7.81213 18.9583 8.93983 19.8248 9.45178Z"
+        fill="white"
+      />
+    </g>
+  </svg>
+);
+
+export default Linux;

components/Icons/Platform/Microsoft.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Microsoft: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path fill="#FEBA08" d="M17 17h10v10H17z" />
+    <path fill="#05A6F0" d="M5 17h10v10H5z" />
+    <path fill="#80BC06" d="M17 5h10v10H17z" />
+    <path fill="#F25325" d="M5 5h10v10H5z" />
+  </svg>
+);
+
+export default Microsoft;

components/Icons/Platform/NVM.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const NVM: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_423_27755)">
+      <g clipPath="url(#clip1_423_27755)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M1.46 9.846H.104l.792 1.39H2.25l-.792-1.39Z"
+          fill="#333"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="m11.499 14.19-.299-.563-.914-1.565-1.002.017.263.475-2.567.018-.562-.967-1.882.017 10.18 16 3.816-6.822-3.06-5.257-.316-.545-.703-1.213-2.954.404Z"
+          fill="#333"
+          stroke="#333"
+          strokeWidth=".352"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M20.976 12.642c.809-1.39 1.617-2.778 2.409-4.167.175-.3.386-.422.738-.422 2.356.017 4.712 0 7.05 0 .669 0 .845.263.563.879-.738 1.248-1.494 2.479-2.163 3.762-.79 1.354-1.582 2.69-2.373 4.044-1.74 3.025-3.481 6.049-5.24 9.055-.861 1.442-1.705 2.884-2.69 4.255-.21.3-.44.598-.686.862-.632.668-1.16.668-1.793-.018-.299-.316-1.266-1.723-.756-.896-.826-1.301-1.829-2.778-2.655-4.08.264-.615 3.165-5.855 3.921-7.173.088-.088 2.567-4.185 3.675-6.101Z"
+          fill="#F4DD4B"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="m13.398 25.917 4.009-7.368-1.09-1.828"
+          fill="#000"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="m5.503 7.508-1.125.017.686 1.125h.404l.633 1.055 1.846-.035-1.125-1.864-1.125.036-.194-.334ZM5.345 2.075l-1.108.017.668 1.108 1.108-.018-.668-1.107ZM3.376 3.64l-.932.017.563.914.932-.017-.563-.915ZM7.314.193l-.773.018.404.668.774-.018-.405-.668ZM5.521 5.24l-.985.035.51.844.985-.036-.51-.844ZM10.303 5.785l-1.582.035-.264-.422-1.424.035.756 1.23.967-.017.739 1.213 2.04-.035-1.232-2.04ZM8.633 3.042l-1.372.035.721 1.196 1.372-.036-.721-1.195ZM2.567.527l-.633.018.334.545.633-.018-.334-.545ZM13.011 10.022l-2.514.053.51.809h.756l.475.756 1.74-.036-.967-1.582ZM3.147 5.714l-.773.018.404.668.774-.018-.405-.668Z"
+          fill="#333"
+          stroke="#333"
+          strokeWidth=".352"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+    </g>
+    <defs>
+      <clipPath id="clip0_423_27755">
+        <path fill="#fff" d="M0 0h32v32H0z" />
+      </clipPath>
+      <clipPath id="clip1_423_27755">
+        <path fill="#fff" d="M0 0h32v31.473H0z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default NVM;

components/Icons/Social/LinkedIn.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const LinkedIn: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 20 20"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g id="Social Icon">
+      <rect id="bg" width="20" height="20" rx="10" fill="#1275B1" />
+      <g id="linked_in">
+        <path
+          d="M7.58468 5.49444C7.58468 6.16198 7.00608 6.70312 6.29234 6.70312C5.5786 6.70312 5 6.16198 5 5.49444C5 4.82691 5.5786 4.28577 6.29234 4.28577C7.00608 4.28577 7.58468 4.82691 7.58468 5.49444Z"
+          fill="white"
+        />
+        <path
+          d="M5.17673 7.59155H7.38586V14.2858H5.17673V7.59155Z"
+          fill="white"
+        />
+        <path
+          d="M10.9426 7.59155H8.73343V14.2858H10.9426C10.9426 14.2858 10.9426 12.1783 10.9426 10.8607C10.9426 10.0698 11.2126 9.27544 12.2901 9.27544C13.5079 9.27544 13.5005 10.3104 13.4949 11.1123C13.4874 12.1604 13.5052 13.2299 13.5052 14.2858H15.7143V10.7527C15.6956 8.49675 15.1077 7.45725 13.1738 7.45725C12.0253 7.45725 11.3134 7.97867 10.9426 8.4504V7.59155Z"
+          fill="white"
+        />
+      </g>
+    </g>
+  </svg>
+);
+
+export default LinkedIn;

components/Icons/Social/Mastodon.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Mastodon: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 20 20"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#a)">
+      <path
+        fill="#2B90D9"
+        fillRule="evenodd"
+        d="M14.296 15.244c2.506-.3 4.688-1.843 4.963-3.254.432-2.223.396-5.424.396-5.424 0-4.338-2.843-5.61-2.843-5.61C15.38.298 12.918.021 10.363 0h-.064c-2.556.02-5.016.298-6.45.956 0 0-2.842 1.272-2.842 5.61l-.003.828c-.004.8-.008 1.687.015 2.613.103 4.243.778 8.425 4.7 9.463 1.81.48 3.363.58 4.613.51 2.268-.125 3.542-.809 3.542-.809l-.075-1.646s-1.621.512-3.441.45c-1.804-.063-3.708-.195-4-2.41a4.54 4.54 0 0 1-.04-.62s1.77.432 4.014.535c1.372.063 2.659-.08 3.966-.236Zm2.007-3.088V6.903c0-1.074-.274-1.927-.823-2.558-.566-.631-1.308-.955-2.228-.955-1.065 0-1.872.41-2.405 1.228l-.518.87-.519-.87C9.277 3.8 8.47 3.39 7.405 3.39c-.92 0-1.662.324-2.228.955-.549.631-.822 1.484-.822 2.558v5.253h2.08V7.057c0-1.075.453-1.62 1.358-1.62 1 0 1.501.647 1.501 1.927v2.79h2.07v-2.79c0-1.28.5-1.927 1.5-1.927.905 0 1.357.545 1.357 1.62v5.1h2.082Z"
+        clipRule="evenodd"
+      />
+    </g>
+    <defs>
+      <clipPath id="a">
+        <path fill="#fff" d="M0 0h20v20H0z" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default Mastodon;

components/Icons/Social/Slack.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Slack: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 20 20"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      fill="#2EB67D"
+      d="M16.563 9.375A1.562 1.562 0 1 0 15 7.813v1.562h1.563Zm-4.375 0c.862 0 1.562-.7 1.562-1.563V3.438a1.563 1.563 0 0 0-3.125 0v4.374c0 .863.7 1.563 1.563 1.563Z"
+    />
+    <path
+      fill="#E01E5A"
+      d="M3.437 10.625A1.562 1.562 0 1 0 5 12.187v-1.562H3.437Zm4.376 0c-.863 0-1.563.7-1.563 1.563v4.374a1.563 1.563 0 0 0 3.125 0v-4.374c0-.863-.7-1.563-1.563-1.563Z"
+    />
+    <path
+      fill="#ECB22E"
+      d="M10.625 16.563A1.562 1.562 0 1 0 12.187 15h-1.562v1.563Zm0-4.375c0 .862.7 1.562 1.563 1.562h4.374a1.562 1.562 0 1 0 0-3.125h-4.374c-.863 0-1.563.7-1.563 1.563Z"
+    />
+    <path
+      fill="#36C5F0"
+      d="M9.375 3.437A1.562 1.562 0 1 0 7.813 5h1.562V3.437Zm0 4.376c0-.863-.7-1.563-1.563-1.563H3.438a1.563 1.563 0 0 0 0 3.125h4.374c.863 0 1.563-.7 1.563-1.563Z"
+    />
+  </svg>
+);
+
+export default Slack;

components/Icons/Social/Twitter.tsx

···
+import type { FC, SVGProps } from 'react';
+
+const Twitter: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 20 20"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M6.278 18.429c-2.311 0-4.465-.672-6.278-1.832 1.54.1 4.256-.14 5.945-1.75-2.541-.117-3.688-2.067-3.837-2.9.216.083 1.246.183 1.827-.05C1.011 11.164.563 8.598.662 7.815c.549.383 1.479.516 1.845.483C-.218 6.348.762 3.416 1.244 2.783c1.955 2.709 4.885 4.23 8.51 4.315a4.19 4.19 0 0 1-.104-.933A4.16 4.16 0 0 1 13.803 2c1.199 0 2.279.51 3.037 1.323.8-.187 2.006-.627 2.595-1.006-.297 1.066-1.221 1.955-1.78 2.285-.005-.011.004.011 0 0 .49-.074 1.82-.33 2.345-.686-.26.6-1.24 1.595-2.044 2.153.15 6.601-4.901 12.36-11.678 12.36Z"
+      fill="#47ACDF"
+    />
+  </svg>
+);
+
+export default Twitter;

components/__design__/list.stories.tsx

···
 
 export const OrderedLists: StoryObj = {
   render: () => (
-    <div>
+    <div className="mdxContent">
       <ol>
         <li>Ordered lists</li>
         <li>Like this</li>
···
 
 export const UnorderedLists: StoryObj = {
   render: () => (
-    <div>
+    <div className="mdxContent">
       <ul>
         <li>Unordered lists</li>
         <li>those without</li>

components/__design__/node-logos.stories.tsx

···
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
-import Image from 'next/image';
+
+import JsIconGreen from '@/components/Icons/Logos/JsIconGreen';
+import JsIconWhite from '@/components/Icons/Logos/JsIconWhite';
+import NodejsLogoDark from '@/components/Icons/Logos/NodejsDark';
+import NodejsLogoLight from '@/components/Icons/Logos/NodejsLight';
+import NodejsStackedBlack from '@/components/Icons/Logos/NodejsStackedBlack';
+import NodejsStackedDark from '@/components/Icons/Logos/NodejsStackedDark';
+import NodejsStackedLight from '@/components/Icons/Logos/NodejsStackedLight';
+import NodejsStackedWhite from '@/components/Icons/Logos/NodejsStackedWhite';
 
 export const HorizontalLogos: StoryObj = {
   render: () => (
     <div className="flex flex-row gap-4">
-      <Image
-        src={`/static/images/logos/horizontal-light.svg`}
-        className="bg-black"
-        alt="Node.js"
-        width={267}
-        height={80}
-      />
-      <Image
-        src={`/static/images/logos/horizontal-dark.svg`}
-        alt="Node.js"
-        width={267}
-        height={80}
-      />
+      <NodejsLogoLight width={267} height={80} className="hidden dark:block" />
+      <NodejsLogoDark width={267} height={80} className="block dark:hidden" />
     </div>
   ),
 };
···
   render: () => (
     <div className="flex flex-row gap-4">
       <div className="flex flex-col gap-2">
-        <Image
-          src={`/static/images/logos/stacked-dark.svg`}
-          alt="Node.js"
+        <NodejsStackedDark
+          className="block dark:hidden"
           width={267}
-          height={80}
+          height={164}
         />
-        <Image
-          src={`/static/images/logos/stacked-black.svg`}
-          alt="Node.js"
+
+        <NodejsStackedBlack
+          className="block dark:hidden"
           width={267}
-          height={80}
+          height={164}
         />
-      </div>
-      <div className="flex flex-col gap-2">
-        <Image
-          src={`/static/images/logos/stacked-white.svg`}
-          alt="Node.js"
+
+        <NodejsStackedLight
+          className="hidden dark:block"
           width={267}
-          height={80}
+          height={164}
         />
-        <Image
-          src={`/static/images/logos/stacked-light.svg`}
-          alt="Node.js"
+
+        <NodejsStackedWhite
+          className="hidden dark:block"
           width={267}
-          height={80}
+          height={164}
         />
       </div>
     </div>
···
 export const JSSymbols: StoryObj = {
   render: () => (
     <div className="flex flex-row gap-4">
-      <Image
-        src={`/static/images/logos/js-white.svg`}
-        alt="Node.js"
-        width={30}
-        height={30}
-      />
-      <Image
-        src={`/static/images/logos/js-green.svg`}
-        alt="Node.js"
-        width={30}
-        height={30}
-      />
+      <JsIconWhite className="hidden dark:block" width={30} height={30} />
+      <JsIconGreen className="block dark:hidden" width={30} height={30} />
     </div>
   ),
 };

components/__design__/platform-logos.stories.tsx

···
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
-import Image from 'next/image';
+
+import Apple from '@/components/Icons/Platform/Apple';
+import Generic from '@/components/Icons/Platform/Generic';
+import Homebrew from '@/components/Icons/Platform/Homebrew';
+import Linux from '@/components/Icons/Platform/Linux';
+import Microsoft from '@/components/Icons/Platform/Microsoft';
+import NVM from '@/components/Icons/Platform/NVM';
 
 export const PlatformLogos: StoryObj = {
   render: () => (
     <div className="flex flex-row gap-4">
       <div className="flex flex-col items-center gap-4">
-        <Image
-          src="/static/images/logos/platform-linux.svg"
-          alt="Ubuntu Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/platform-apple.svg"
-          alt="Apple Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/platform-nvm.svg"
-          alt="NVM Logo"
-          width={64}
-          height={64}
-        />
+        <Linux width={64} height={64} />
+        <Apple width={64} height={64} />
+        <NVM width={64} height={64} />
       </div>
       <div className="flex flex-col items-center gap-4">
-        <Image
-          src="/static/images/logos/platform-microsoft.svg"
-          alt="Microsoft Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/platform-homebrew.svg"
-          alt="Homebrew Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/platform-placeholder.svg"
-          alt="Placeholder Logo"
-          width={64}
-          height={64}
-        />
+        <Microsoft width={64} height={64} />
+        <Homebrew width={64} height={64} />
+        <Generic width={64} height={64} />
       </div>
     </div>
   ),

components/__design__/social-logos.stories.tsx

···
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
-import Image from 'next/image';
+
+import GitHub from '@/components/Icons/Social/GitHub';
+import LinkedIn from '@/components/Icons/Social/LinkedIn';
+import Mastodon from '@/components/Icons/Social/Mastodon';
+import Slack from '@/components/Icons/Social/Slack';
+import Twitter from '@/components/Icons/Social/Twitter';
 
 export const SocialMediaLogos: StoryObj = {
   render: () => (
     <div className="flex flex-row gap-4">
       <div className="flex flex-col items-center gap-4">
-        <Image
-          src="/static/images/logos/social-github.svg"
-          alt="GitHub Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/social-mastodon.svg"
-          alt="Mastodon Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/social-linkedin.svg"
-          alt="LinkedIn Logo"
-          width={64}
-          height={64}
-        />
+        <GitHub width={64} height={64} />
+        <Mastodon width={64} height={64} />
+        <LinkedIn width={64} height={64} />
       </div>
       <div className="flex flex-col items-center gap-4">
-        <Image
-          src="/static/images/logos/social-slack.svg"
-          alt="Slack Logo"
-          width={64}
-          height={64}
-        />
-        <Image
-          src="/static/images/logos/social-twitter.svg"
-          alt="Twitter Logo"
-          width={64}
-          height={64}
-        />
+        <Slack width={64} height={64} />
+        <Twitter width={64} height={64} />
       </div>
     </div>
   ),

components/__design__/table.stories.tsx

···
 
 export const Table: StoryObj = {
   render: () => (
-    <table>
-      <thead>
-        <tr>
-          <th>Column 1</th>
-          <th>Column 2</th>
-          <th>Column 3</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td>Data 1</td>
-          <td>Data 2</td>
-          <td>Data 3</td>
-        </tr>
-        <tr>
-          <td>Data 1</td>
-          <td>Data 2</td>
-          <td>Data 3</td>
-        </tr>
-        <tr>
-          <td>Data 1</td>
-          <td>Data 2</td>
-          <td>Data 3</td>
-        </tr>
-      </tbody>
-    </table>
+    <div className="mdxContent">
+      <table>
+        <thead>
+          <tr>
+            <th>Column 1</th>
+            <th>Column 2</th>
+            <th>Column 3</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td>Data 1</td>
+            <td>Data 2</td>
+            <td>Data 3</td>
+          </tr>
+          <tr>
+            <td>Data 1</td>
+            <td>Data 2</td>
+            <td>Data 3</td>
+          </tr>
+          <tr>
+            <td>Data 1</td>
+            <td>Data 2</td>
+            <td>Data 3</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
   ),
 };
 
 export const HeadlessTable: StoryObj = {
   render: () => (
-    <table>
-      <tbody>
-        <tr>
-          <td>Data 1</td>
-          <td>Data 2</td>
-          <td>Data 3</td>
-        </tr>
-        <tr>
-          <td>Data 1</td>
-          <td>Data 2</td>
-          <td>Data 3</td>
-        </tr>
-        <tr>
-          <td>Data 1</td>
-          <td>Data 2</td>
-          <td>Data 3</td>
-        </tr>
-      </tbody>
-    </table>
+    <div className="mdxContent">
+      <table>
+        <tbody>
+          <tr>
+            <td>Data 1</td>
+            <td>Data 2</td>
+            <td>Data 3</td>
+          </tr>
+          <tr>
+            <td>Data 1</td>
+            <td>Data 2</td>
+            <td>Data 3</td>
+          </tr>
+          <tr>
+            <td>Data 1</td>
+            <td>Data 2</td>
+            <td>Data 3</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
   ),
 };
 

components/__design__/text.stories.tsx

···
 
 export const Anchor: StoryObj = {
   render: () => (
-    <div>
+    <div className="mdxContent">
       <p>
         The current Node.js security policy can be found at{' '}
         <a href="https://github.com/nodejs/node/security/policy#security">
···
 
 export const InlineCode: StoryObj = {
   render: () => (
-    <div>
+    <div className="mdxContent">
       This is an example of <code>inline code block</code>
     </div>
   ),
···
 
 export const Headings: StoryObj = {
   render: () => (
-    <>
+    <div className="mdxContent">
       <h1>HTML Section Heading 1</h1>
       <h2>HTML Section Heading 2</h2>
       <h3>HTML Section Heading 3</h3>
       <h4>HTML Section Heading 4</h4>
       <h5>HTML Section Heading 5</h5>
       <h6>HTML Section Heading 6</h6>
-    </>
+    </div>
   ),
 };
 

components/mdxRenderer.tsx

···
 };
 
 export const MDXRenderer: FC<{ Component: MDXContent }> = ({ Component }) => (
-  <Component components={combinedComponents} />
+  <div className="mdxContent">
+    <Component components={combinedComponents} />
+  </div>
 );

public/static/images/logos/horizontal-dark.svg

···
-<svg width="267" height="80" viewBox="0 0 267 80" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_1804_2337" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="267" height="80"><path d="M267 0H0V79.3784H267V0Z" fill="white"/></mask><g mask="url(#mask0_1804_2337)"><path d="M234.983 78.7547C234.292 78.7547 233.648 78.5695 233.05 78.2452L226.929 74.5871C226.008 74.0776 226.469 73.8924 226.745 73.7998C227.987 73.3829 228.217 73.2903 229.506 72.5495C229.644 72.4569 229.828 72.5033 229.966 72.5959L234.66 75.4206C234.844 75.5132 235.074 75.5132 235.212 75.4206L253.575 64.7235C253.758 64.6309 253.852 64.4457 253.852 64.2143V42.8665C253.852 42.6351 253.758 42.4499 253.575 42.3573L235.212 31.7067C235.028 31.614 234.798 31.614 234.66 31.7067L216.298 42.3573C216.114 42.4499 216.022 42.6813 216.022 42.8665V64.2143C216.022 64.3995 216.114 64.6309 216.298 64.7235L221.314 67.641C224.029 69.0301 225.732 67.4094 225.732 65.7886V44.7189C225.732 44.4411 225.962 44.1633 226.285 44.1633H228.632C228.908 44.1633 229.184 44.3947 229.184 44.7189V65.7886C229.184 69.447 227.205 71.577 223.753 71.577C222.695 71.577 221.867 71.577 219.519 70.4195L214.687 67.641C213.491 66.9463 212.754 65.6498 212.754 64.2604V42.913C212.754 41.5236 213.491 40.2271 214.687 39.5324L233.05 28.8356C234.2 28.1873 235.765 28.1873 236.915 28.8356L255.278 39.5324C256.474 40.2271 257.21 41.5236 257.21 42.913V64.2604C257.21 65.6498 256.474 66.9463 255.278 67.641L236.915 78.3378C236.363 78.5695 235.673 78.7547 234.983 78.7547Z" fill="#5FA04E"/><path d="M240.69 64.075C232.635 64.075 230.978 60.3704 230.978 57.2215C230.978 56.9437 231.208 56.6658 231.53 56.6658H233.923C234.2 56.6658 234.43 56.8511 234.43 57.1289C234.798 59.5831 235.856 60.7873 240.735 60.7873C244.601 60.7873 246.258 59.9074 246.258 57.8236C246.258 56.6197 245.796 55.7398 239.768 55.1377C234.752 54.6282 231.622 53.5169 231.622 49.4881C231.622 45.7374 234.752 43.5145 239.998 43.5145C245.89 43.5145 248.789 45.5521 249.157 49.9976C249.157 50.1366 249.111 50.2754 249.02 50.4144C248.926 50.507 248.789 50.5997 248.649 50.5997H246.21C245.982 50.5997 245.751 50.4144 245.705 50.1828C245.152 47.6359 243.725 46.8025 239.952 46.8025C235.718 46.8025 235.212 48.2842 235.212 49.3955C235.212 50.7384 235.81 51.1553 241.517 51.8962C247.177 52.637 249.847 53.7021 249.847 57.6845C249.847 61.7595 246.487 64.075 240.69 64.075Z" fill="#5FA04E"/><path d="M267.2 41.6621C267.2 43.6071 265.588 45.2279 263.654 45.2279C261.722 45.2279 260.111 43.6533 260.111 41.6621C260.111 39.6247 261.768 38.0966 263.654 38.0966C265.542 38.0966 267.2 39.6709 267.2 41.6621ZM260.664 41.6621C260.664 43.3293 261.999 44.6722 263.608 44.6722C265.266 44.6722 266.601 43.2829 266.601 41.6621C266.601 39.9951 265.266 38.6986 263.608 38.6986C262.045 38.6986 260.664 39.9951 260.664 41.6621ZM262.321 39.6709H263.702C264.162 39.6709 265.083 39.6709 265.083 40.736C265.083 41.4769 264.621 41.6159 264.344 41.7085C264.898 41.7547 264.943 42.1254 264.989 42.6346C265.035 42.9588 265.083 43.5145 265.174 43.6997H264.344C264.344 43.5145 264.207 42.4958 264.207 42.4494C264.162 42.218 264.07 42.1254 263.794 42.1254H263.103V43.7459H262.321V39.6709ZM263.057 41.4307H263.654C264.162 41.4307 264.253 41.0603 264.253 40.875C264.253 40.3194 263.885 40.3194 263.654 40.3194H263.012V41.4307H263.057Z" fill="#5FA04E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M43.6737 41.9539C43.6737 41.1204 43.2136 40.3334 42.4773 39.9165L23.0104 28.5712C22.6883 28.386 22.3201 28.2934 21.9519 28.2472C21.9059 28.2472 21.7679 28.2472 21.7679 28.2472C21.3997 28.2472 21.0315 28.386 20.7094 28.5712L1.19654 39.8701C0.460209 40.287 0 41.0743 0 41.9539L0.0460209 72.3315C0.0460209 72.7484 0.276126 73.165 0.644293 73.3502C1.01246 73.5819 1.47267 73.5819 1.79482 73.3502L13.3921 66.682C14.1284 66.2653 14.5886 65.4781 14.5886 64.6446V50.4282C14.5886 49.5947 15.0488 48.8074 15.7852 48.3908L20.7094 45.5197C21.0776 45.288 21.4917 45.1954 21.9059 45.1954C22.3201 45.1954 22.7343 45.288 23.0565 45.5197L27.9806 48.3908C28.7169 48.8074 29.1773 49.5947 29.1773 50.4282V64.6446C29.1773 65.4781 29.6375 66.2653 30.3738 66.682L41.8791 73.3502C42.2471 73.5819 42.7073 73.5819 43.0755 73.3502C43.4438 73.165 43.6737 72.7484 43.6737 72.3315V41.9539Z" fill="#333333"/><path fill-rule="evenodd" clip-rule="evenodd" d="M137.465 0.138922C137.096 -0.0463072 136.636 -0.0463072 136.314 0.138922C135.946 0.370456 135.716 0.740915 135.716 1.15768V31.2573C135.716 31.5351 135.578 31.8129 135.301 31.9984C135.025 32.1372 134.749 32.1372 134.473 31.9984L129.595 29.1735C128.859 28.7569 127.984 28.7569 127.248 29.1735L107.735 40.5188C106.999 40.9357 106.539 41.7227 106.539 42.5562V65.2004C106.539 66.0342 106.999 66.8212 107.735 67.2381L127.248 78.5834C127.984 79 128.859 79 129.595 78.5834L149.108 67.2381C149.844 66.8212 150.304 66.0342 150.304 65.2004V8.75207C150.304 7.87222 149.844 7.085 149.108 6.66824L137.465 0.138922ZM135.67 57.7451C135.67 57.9765 135.578 58.1617 135.394 58.2544L128.72 62.1444C128.536 62.237 128.306 62.237 128.122 62.1444L121.449 58.2544C121.265 58.1617 121.173 57.9303 121.173 57.7451V49.9656C121.173 49.7339 121.265 49.5487 121.449 49.4561L128.122 45.5663C128.306 45.4737 128.536 45.4737 128.72 45.5663L135.394 49.4561C135.578 49.5487 135.67 49.7803 135.67 49.9656V57.7451Z" fill="#333333"/><path fill-rule="evenodd" clip-rule="evenodd" d="M202.398 49.7801C203.135 49.3632 203.549 48.5762 203.549 47.7425V42.2319C203.549 41.3985 203.089 40.6112 202.398 40.1946L183.023 28.8957C182.287 28.4788 181.413 28.4788 180.676 28.8957L161.164 40.2407C160.427 40.6576 159.967 41.4449 159.967 42.2784V64.9226C159.967 65.7561 160.427 66.5434 161.164 66.96L180.538 78.0737C181.275 78.4905 182.149 78.4905 182.839 78.0737L194.575 71.4983C194.943 71.3131 195.173 70.8962 195.173 70.4793C195.173 70.0627 194.943 69.6459 194.575 69.4606L174.97 58.1153C174.602 57.8839 174.372 57.5135 174.372 57.0966V50.0117C174.372 49.5949 174.602 49.178 174.97 48.9928L181.091 45.4735C181.459 45.2421 181.919 45.2421 182.287 45.4735L188.408 48.9928C188.776 49.2245 189.006 49.5949 189.006 50.0117V55.5685C189.006 55.9853 189.236 56.4019 189.605 56.5872C189.973 56.8188 190.433 56.8188 190.801 56.5872L202.398 49.7801Z" fill="#333333"/><path fill-rule="evenodd" clip-rule="evenodd" d="M181.551 48.7155C181.689 48.6228 181.874 48.6228 182.012 48.7155L185.739 50.8919C185.877 50.9845 185.969 51.1235 185.969 51.3087V55.6615C185.969 55.8468 185.877 55.9858 185.739 56.0784L182.012 58.2548C181.874 58.3474 181.689 58.3474 181.551 58.2548L177.824 56.0784C177.686 55.9858 177.594 55.8468 177.594 55.6615V51.3087C177.594 51.1235 177.686 50.9845 177.824 50.8919L181.551 48.7155Z" fill="#5FA04E"/><path d="M76.3012 28.9882C75.5647 28.5716 74.6903 28.5716 73.954 28.9882L54.5792 40.241C53.8429 40.6578 53.4287 41.4449 53.4287 42.2786V64.83C53.4287 65.6637 53.8889 66.4507 54.5792 66.8676L73.954 78.1203C74.6903 78.5369 75.5647 78.5369 76.3012 78.1203L95.6758 66.8676C96.4123 66.4507 96.8263 65.6637 96.8263 64.83V42.2786C96.8263 41.4449 96.3662 40.6578 95.6758 40.241L76.3012 28.9882Z" fill="url(#paint0_linear_1804_2337)"/><path d="M95.7218 40.241L76.2551 28.9882C76.0709 28.8956 75.8409 28.803 75.6567 28.7568L53.843 66.3119C54.027 66.5433 54.257 66.7286 54.4872 66.8676L73.9541 78.1203C74.5062 78.4443 75.1506 78.5369 75.7488 78.3517L96.2282 40.6578C96.0901 40.4726 95.9059 40.3336 95.7218 40.241Z" fill="url(#paint1_linear_1804_2337)"/><path d="M95.7224 66.8669C96.2747 66.5427 96.6889 65.9871 96.8729 65.385L75.5651 28.7098C75.013 28.6172 74.4146 28.6633 73.9085 28.9876L54.5796 40.1939L75.427 78.4437C75.7031 78.3973 76.0255 78.3046 76.3016 78.1659L95.7224 66.8669Z" fill="url(#paint2_linear_1804_2337)"/></g><defs><linearGradient id="paint0_linear_1804_2337" x1="83.0183" y1="37.3689" x2="65.3246" y2="73.2407" gradientUnits="userSpaceOnUse"><stop stop-color="#3F873F"/><stop offset="0.3296" stop-color="#3F8B3D"/><stop offset="0.6367" stop-color="#3E9638"/><stop offset="0.9341" stop-color="#3DA92E"/><stop offset="1" stop-color="#3DAE2B"/></linearGradient><linearGradient id="paint1_linear_1804_2337" x1="72.183" y1="56.1876" x2="121.552" y2="19.937" gradientUnits="userSpaceOnUse"><stop offset="0.1376" stop-color="#3F873F"/><stop offset="0.4016" stop-color="#52A044"/><stop offset="0.7129" stop-color="#64B749"/><stop offset="0.9081" stop-color="#6ABF4B"/></linearGradient><linearGradient id="paint2_linear_1804_2337" x1="52.7188" y1="53.5463" x2="97.551" y2="53.5463" gradientUnits="userSpaceOnUse"><stop offset="0.0919165" stop-color="#6ABF4B"/><stop offset="0.2871" stop-color="#64B749"/><stop offset="0.5984" stop-color="#52A044"/><stop offset="0.8624" stop-color="#3F873F"/></linearGradient></defs></svg>

public/static/images/logos/horizontal-light.svg

···
-<svg width="267" height="80" viewBox="0 0 267 80" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_1803_3458" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="267" height="80"><path d="M267 0H0V79.3784H267V0Z" fill="white"/></mask><g mask="url(#mask0_1803_3458)"><path d="M234.983 78.7547C234.292 78.7547 233.648 78.5695 233.05 78.2452L226.929 74.5871C226.008 74.0776 226.469 73.8924 226.745 73.7998C227.987 73.3829 228.217 73.2903 229.506 72.5495C229.644 72.4569 229.828 72.5033 229.966 72.5959L234.66 75.4206C234.844 75.5132 235.074 75.5132 235.212 75.4206L253.575 64.7235C253.758 64.6309 253.852 64.4457 253.852 64.2143V42.8665C253.852 42.6351 253.758 42.4499 253.575 42.3573L235.212 31.7067C235.028 31.614 234.798 31.614 234.66 31.7067L216.298 42.3573C216.114 42.4499 216.022 42.6813 216.022 42.8665V64.2143C216.022 64.3995 216.114 64.6309 216.298 64.7235L221.314 67.641C224.029 69.0301 225.732 67.4094 225.732 65.7886V44.7189C225.732 44.4411 225.962 44.1633 226.285 44.1633H228.632C228.908 44.1633 229.184 44.3947 229.184 44.7189V65.7886C229.184 69.447 227.205 71.577 223.753 71.577C222.695 71.577 221.867 71.577 219.519 70.4195L214.687 67.641C213.491 66.9463 212.754 65.6498 212.754 64.2604V42.913C212.754 41.5236 213.491 40.2271 214.687 39.5324L233.05 28.8356C234.2 28.1873 235.765 28.1873 236.915 28.8356L255.278 39.5324C256.474 40.2271 257.21 41.5236 257.21 42.913V64.2604C257.21 65.6498 256.474 66.9463 255.278 67.641L236.915 78.3378C236.363 78.5695 235.673 78.7547 234.983 78.7547Z" fill="#5FA04E"/><path d="M240.69 64.075C232.635 64.075 230.978 60.3704 230.978 57.2215C230.978 56.9437 231.208 56.6658 231.53 56.6658H233.923C234.2 56.6658 234.43 56.8511 234.43 57.1289C234.798 59.5831 235.856 60.7873 240.735 60.7873C244.601 60.7873 246.258 59.9074 246.258 57.8236C246.258 56.6197 245.796 55.7398 239.768 55.1377C234.752 54.6282 231.622 53.5169 231.622 49.4881C231.622 45.7374 234.752 43.5145 239.998 43.5145C245.89 43.5145 248.789 45.5521 249.157 49.9976C249.157 50.1366 249.111 50.2754 249.02 50.4144C248.926 50.507 248.789 50.5997 248.649 50.5997H246.21C245.982 50.5997 245.751 50.4144 245.705 50.1828C245.152 47.6359 243.725 46.8025 239.952 46.8025C235.718 46.8025 235.212 48.2842 235.212 49.3955C235.212 50.7384 235.81 51.1553 241.517 51.8962C247.177 52.637 249.847 53.7021 249.847 57.6845C249.847 61.7595 246.487 64.075 240.69 64.075Z" fill="#5FA04E"/><path d="M267.2 41.6621C267.2 43.6071 265.588 45.2279 263.654 45.2279C261.722 45.2279 260.111 43.6533 260.111 41.6621C260.111 39.6247 261.768 38.0966 263.654 38.0966C265.542 38.0966 267.2 39.6709 267.2 41.6621ZM260.664 41.6621C260.664 43.3293 261.999 44.6722 263.608 44.6722C265.266 44.6722 266.601 43.2829 266.601 41.6621C266.601 39.9951 265.266 38.6986 263.608 38.6986C262.045 38.6986 260.664 39.9951 260.664 41.6621ZM262.321 39.6709H263.702C264.162 39.6709 265.083 39.6709 265.083 40.736C265.083 41.4769 264.621 41.6159 264.344 41.7085C264.898 41.7547 264.943 42.1254 264.989 42.6346C265.035 42.9588 265.083 43.5145 265.174 43.6997H264.344C264.344 43.5145 264.207 42.4958 264.207 42.4494C264.162 42.218 264.07 42.1254 263.794 42.1254H263.103V43.7459H262.321V39.6709ZM263.057 41.4307H263.654C264.162 41.4307 264.253 41.0603 264.253 40.875C264.253 40.3194 263.885 40.3194 263.654 40.3194H263.012V41.4307H263.057Z" fill="#5FA04E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M43.6737 41.9539C43.6737 41.1204 43.2136 40.3334 42.4773 39.9165L23.0104 28.5712C22.6883 28.386 22.3201 28.2934 21.9519 28.2472C21.9059 28.2472 21.7679 28.2472 21.7679 28.2472C21.3997 28.2472 21.0315 28.386 20.7094 28.5712L1.19654 39.8701C0.460209 40.287 0 41.0743 0 41.9539L0.0460209 72.3315C0.0460209 72.7484 0.276126 73.165 0.644293 73.3502C1.01246 73.5819 1.47267 73.5819 1.79482 73.3502L13.3921 66.682C14.1284 66.2653 14.5886 65.4781 14.5886 64.6446V50.4282C14.5886 49.5947 15.0488 48.8074 15.7852 48.3908L20.7094 45.5197C21.0776 45.288 21.4917 45.1954 21.9059 45.1954C22.3201 45.1954 22.7343 45.288 23.0565 45.5197L27.9806 48.3908C28.7169 48.8074 29.1773 49.5947 29.1773 50.4282V64.6446C29.1773 65.4781 29.6375 66.2653 30.3738 66.682L41.8791 73.3502C42.2471 73.5819 42.7073 73.5819 43.0755 73.3502C43.4438 73.165 43.6737 72.7484 43.6737 72.3315V41.9539Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M137.465 0.138922C137.096 -0.0463072 136.636 -0.0463072 136.314 0.138922C135.946 0.370456 135.716 0.740915 135.716 1.15768V31.2573C135.716 31.5351 135.578 31.8129 135.301 31.9984C135.025 32.1372 134.749 32.1372 134.473 31.9984L129.595 29.1735C128.859 28.7569 127.984 28.7569 127.248 29.1735L107.735 40.5188C106.999 40.9357 106.539 41.7227 106.539 42.5562V65.2004C106.539 66.0342 106.999 66.8212 107.735 67.2381L127.248 78.5834C127.984 79 128.859 79 129.595 78.5834L149.108 67.2381C149.844 66.8212 150.304 66.0342 150.304 65.2004V8.75207C150.304 7.87222 149.844 7.085 149.108 6.66824L137.465 0.138922ZM135.67 57.7451C135.67 57.9765 135.578 58.1617 135.394 58.2544L128.72 62.1444C128.536 62.237 128.306 62.237 128.122 62.1444L121.449 58.2544C121.265 58.1617 121.173 57.9303 121.173 57.7451V49.9656C121.173 49.7339 121.265 49.5487 121.449 49.4561L128.122 45.5663C128.306 45.4737 128.536 45.4737 128.72 45.5663L135.394 49.4561C135.578 49.5487 135.67 49.7803 135.67 49.9656V57.7451Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M202.398 49.7801C203.135 49.3632 203.549 48.5762 203.549 47.7425V42.2319C203.549 41.3985 203.089 40.6112 202.398 40.1946L183.023 28.8957C182.287 28.4788 181.413 28.4788 180.676 28.8957L161.164 40.2407C160.427 40.6576 159.967 41.4449 159.967 42.2784V64.9226C159.967 65.7561 160.427 66.5434 161.164 66.96L180.538 78.0737C181.275 78.4905 182.149 78.4905 182.839 78.0737L194.575 71.4983C194.943 71.3131 195.173 70.8962 195.173 70.4793C195.173 70.0627 194.943 69.6459 194.575 69.4606L174.97 58.1153C174.602 57.8839 174.372 57.5135 174.372 57.0966V50.0117C174.372 49.5949 174.602 49.178 174.97 48.9928L181.091 45.4735C181.459 45.2421 181.919 45.2421 182.287 45.4735L188.408 48.9928C188.776 49.2245 189.006 49.5949 189.006 50.0117V55.5685C189.006 55.9853 189.236 56.4019 189.605 56.5872C189.973 56.8188 190.433 56.8188 190.801 56.5872L202.398 49.7801Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M181.551 48.7155C181.689 48.6228 181.874 48.6228 182.012 48.7155L185.739 50.8919C185.877 50.9845 185.969 51.1235 185.969 51.3087V55.6615C185.969 55.8468 185.877 55.9858 185.739 56.0784L182.012 58.2548C181.874 58.3474 181.689 58.3474 181.551 58.2548L177.824 56.0784C177.686 55.9858 177.594 55.8468 177.594 55.6615V51.3087C177.594 51.1235 177.686 50.9845 177.824 50.8919L181.551 48.7155Z" fill="#5FA04E"/><path d="M76.3012 28.9882C75.5647 28.5716 74.6903 28.5716 73.954 28.9882L54.5792 40.241C53.8429 40.6578 53.4287 41.4449 53.4287 42.2786V64.83C53.4287 65.6637 53.8889 66.4507 54.5792 66.8676L73.954 78.1203C74.6903 78.5369 75.5647 78.5369 76.3012 78.1203L95.6758 66.8676C96.4123 66.4507 96.8263 65.6637 96.8263 64.83V42.2786C96.8263 41.4449 96.3662 40.6578 95.6758 40.241L76.3012 28.9882Z" fill="url(#paint0_linear_1803_3458)"/><path d="M95.7221 40.241L76.2554 28.9882C76.0714 28.8956 75.8412 28.803 75.6572 28.7568L53.8433 66.3119C54.0273 66.5433 54.2575 66.7286 54.4874 66.8676L73.9544 78.1203C74.5067 78.4443 75.1508 78.5369 75.749 78.3517L96.2284 40.6578C96.0904 40.4726 95.9063 40.3336 95.7221 40.241Z" fill="url(#paint1_linear_1803_3458)"/><path d="M95.7224 66.8669C96.2747 66.5427 96.6889 65.9871 96.8729 65.385L75.5651 28.7098C75.013 28.6172 74.4146 28.6633 73.9085 28.9876L54.5796 40.1939L75.427 78.4437C75.7031 78.3973 76.0255 78.3046 76.3016 78.1659L95.7224 66.8669Z" fill="url(#paint2_linear_1803_3458)"/></g><defs><linearGradient id="paint0_linear_1803_3458" x1="83.0183" y1="37.3689" x2="65.3246" y2="73.2407" gradientUnits="userSpaceOnUse"><stop stop-color="#3F873F"/><stop offset="0.3296" stop-color="#3F8B3D"/><stop offset="0.6367" stop-color="#3E9638"/><stop offset="0.9341" stop-color="#3DA92E"/><stop offset="1" stop-color="#3DAE2B"/></linearGradient><linearGradient id="paint1_linear_1803_3458" x1="72.1833" y1="56.1876" x2="121.552" y2="19.937" gradientUnits="userSpaceOnUse"><stop offset="0.1376" stop-color="#3F873F"/><stop offset="0.4016" stop-color="#52A044"/><stop offset="0.7129" stop-color="#64B749"/><stop offset="0.9081" stop-color="#6ABF4B"/></linearGradient><linearGradient id="paint2_linear_1803_3458" x1="52.7188" y1="53.5463" x2="97.551" y2="53.5463" gradientUnits="userSpaceOnUse"><stop offset="0.0919165" stop-color="#6ABF4B"/><stop offset="0.2871" stop-color="#64B749"/><stop offset="0.5984" stop-color="#52A044"/><stop offset="0.8624" stop-color="#3F873F"/></linearGradient></defs></svg>

public/static/images/logos/js-green.svg

···
-<svg width="71" height="80" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_337_7891)" fill="#5FA04E"><path d="M35.625 79.5c-1.081 0-2.09-.288-3.028-.792l-9.59-5.686c-1.442-.792-.721-1.08-.289-1.224 1.947-.648 2.308-.792 4.327-1.944.216-.144.504-.072.72.072l7.356 4.391c.288.144.649.144.865 0l28.77-16.628c.289-.144.433-.431.433-.791V23.714c0-.36-.144-.648-.432-.792L35.986 6.366c-.288-.144-.65-.144-.865 0L6.35 22.922c-.29.144-.434.504-.434.792v33.184c0 .287.145.647.433.791l7.86 4.535c4.254 2.16 6.922-.36 6.922-2.879V26.593c0-.432.36-.864.865-.864h3.678c.432 0 .865.36.865.864v32.752c0 5.687-3.1 8.998-8.509 8.998-1.658 0-2.956 0-6.633-1.8l-7.572-4.319A6.073 6.073 0 0 1 .798 56.97V23.786a6.073 6.073 0 0 1 3.028-5.255l28.77-16.628c1.804-1.008 4.255-1.008 6.058 0l28.77 16.628a6.073 6.073 0 0 1 3.029 5.255V56.97a6.073 6.073 0 0 1-3.029 5.254l-28.77 16.628c-.865.36-1.947.648-3.029.648Z"/><path d="M44.567 56.682c-12.62 0-15.215-5.759-15.215-10.654 0-.432.36-.864.865-.864h3.75c.433 0 .793.288.793.72.577 3.815 2.235 5.687 9.879 5.687 6.057 0 8.652-1.368 8.652-4.607 0-1.871-.72-3.24-10.167-4.175-7.86-.792-12.762-2.52-12.762-8.782 0-5.83 4.903-9.285 13.123-9.285 9.23 0 13.772 3.167 14.35 10.077 0 .216-.073.432-.217.648-.144.144-.36.288-.577.288h-3.822a.844.844 0 0 1-.793-.648c-.865-3.96-3.1-5.255-9.013-5.255-6.634 0-7.427 2.304-7.427 4.031 0 2.088.937 2.736 9.879 3.887 8.869 1.152 13.05 2.808 13.05 8.998 0 6.335-5.263 9.934-14.348 9.934Z"/></g><defs><clipPath id="clip0_337_7891"><path fill="#fff" d="M0 .5h71v79H0z"/></clipPath></defs></svg>

public/static/images/logos/js-white.svg

···
-<svg width="71" height="80" viewBox="0 0 71 80" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_337_7892)"><path d="M35.1193 79.5C34.0343 79.5 33.0217 79.2106 32.0813 78.7041L22.4611 72.9884C21.0144 72.1925 21.7378 71.9031 22.1718 71.7584C24.1247 71.1072 24.4864 70.9625 26.5117 69.8049C26.7287 69.6602 27.0181 69.7326 27.2351 69.8773L34.613 74.2907C34.9023 74.4354 35.264 74.4354 35.481 74.2907L64.3417 57.5775C64.6311 57.4328 64.7757 57.1434 64.7757 56.7817V23.4276C64.7757 23.0659 64.6311 22.7765 64.3417 22.6318L35.481 5.99096C35.1917 5.84626 34.83 5.84626 34.613 5.99096L5.75223 22.6318C5.4629 22.7765 5.31823 23.1382 5.31823 23.4276V56.7817C5.31823 57.0711 5.4629 57.4328 5.75223 57.5775L13.6365 62.1357C17.9041 64.3062 20.5804 61.7739 20.5804 59.2416V26.3217C20.5804 25.8876 20.9421 25.4535 21.4484 25.4535H25.1374C25.5714 25.4535 26.0054 25.8152 26.0054 26.3217V59.2416C26.0054 64.9574 22.8951 68.2855 17.4701 68.2855C15.8065 68.2855 14.5045 68.2855 10.8155 66.4767L3.22059 62.1357C1.33994 61.0504 0.182617 59.0246 0.182617 56.854V23.5C0.182617 21.3295 1.33994 19.3036 3.22059 18.2183L32.0813 1.50517C33.8897 0.492253 36.349 0.492253 38.1573 1.50517L67.0181 18.2183C68.8987 19.3036 70.056 21.3295 70.056 23.5V56.854C70.056 59.0246 68.8987 61.0504 67.0181 62.1357L38.1573 78.8488C37.2893 79.2106 36.2043 79.5 35.1193 79.5Z" fill="white"/><path d="M44.0884 56.5646C31.4302 56.5646 28.8262 50.7765 28.8262 45.8566C28.8262 45.4225 29.1878 44.9883 29.6942 44.9883H33.4555C33.8895 44.9883 34.2511 45.2778 34.2511 45.7119C34.8298 49.5465 36.4934 51.4276 44.1607 51.4276C50.2367 51.4276 52.8406 50.0529 52.8406 46.7971C52.8406 44.916 52.1173 43.5413 42.6417 42.6008C34.7575 41.8049 29.8388 40.0685 29.8388 33.7739C29.8388 27.9134 34.7575 24.4406 43.0034 24.4406C52.262 24.4406 56.8189 27.624 57.3976 34.5697C57.3976 34.7868 57.3253 35.0039 57.1806 35.2209C57.0359 35.3656 56.8189 35.5103 56.6019 35.5103H52.7683C52.4066 35.5103 52.045 35.2209 51.9726 34.8592C51.1047 30.8798 48.8623 29.5775 42.9311 29.5775C36.2764 29.5775 35.4808 31.8927 35.4808 33.6292C35.4808 35.7274 36.4211 36.3785 45.3904 37.5362C54.2873 38.6938 58.4826 40.3579 58.4826 46.5801C58.4826 52.947 53.2023 56.5646 44.0884 56.5646Z" fill="white"/></g><defs><clipPath id="clip0_337_7892"><rect width="71" height="79" fill="white" transform="translate(0 0.5)"/></clipPath></defs></svg>

public/static/images/logos/platform-apple.svg

···
-<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M30 16c0 7.728-6.265 14-14 14S2 23.728 2 16C2 8.265 8.265 2 16 2s14 6.265 14 14Z" fill="#283544"/><path d="M22.562 12.457c-.076.045-1.895.986-1.895 3.07.086 2.38 2.295 3.213 2.333 3.213-.038.045-.334 1.136-1.21 2.28-.694.986-1.466 1.98-2.637 1.98-1.114 0-1.514-.657-2.8-.657-1.381 0-1.772.657-2.829.657-1.171 0-2-1.047-2.733-2.023-.952-1.278-1.761-3.284-1.79-5.21-.02-1.02.19-2.023.724-2.875.752-1.19 2.095-1.997 3.561-2.023 1.124-.036 2.124.719 2.81.719.657 0 1.885-.72 3.275-.72.6.001 2.2.17 3.191 1.59Zm-6.561-1.792c-.2-.932.352-1.864.866-2.458.657-.72 1.695-1.207 2.59-1.207a3.334 3.334 0 0 1-.952 2.511c-.58.72-1.58 1.26-2.504 1.154Z" fill="#fff"/></svg>

public/static/images/logos/platform-homebrew.svg

···
-<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_429_2384)"><path fill-rule="evenodd" clip-rule="evenodd" d="M14.175 5.943c.087-2.773-.847-4.408-3.533-5.488-.763 2.67 2.388 5.132 3.533 5.488Z" fill="#D1D3D4" stroke="#000" stroke-width=".566" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21.458 10.643c.088-2.277-.488-3.196-.92-3.853-.437-.614-1.488-1.577-2.78-1.617-1.22-.039-1.514.636-2.64.677-.185-2.051 1.363-3.177 1.363-3.177s-.424-.598-.774-.745c-.504.448-1.89 1.941-1.57 3.863-1.036-.198-1.767-.792-2.856-.578-1.484.292-2.706 1.19-3.403 3.157-.697 1.968.246 4.264.45 4.92.206.656 1.723 3.444 2.912 3.854 1.188.41 1.189.225 1.824-.02.636-.247 1.6-.697 3.014-.185 1.414.512 1.599.635 2.48.061.882-.573 2.03-2.357 2.296-2.87.266-.512.41-.778.492-1.045.857-.427.033-.4.112-2.442Z" fill="#D1D3D4" stroke="#000" stroke-width=".566" stroke-linejoin="round"/><path d="M23.76 27.287a2.128 2.128 0 0 0 2.133-2.125v-7.656a2.126 2.126 0 0 0-2.125-2.126h-1.753a.473.473 0 0 1-.472-.472v-1.113H7.724l.035 16.32a.472.472 0 0 0 .218.397c.616.357 2.589 1.034 6.732 1.034 4.23 0 6.12-.907 6.662-1.316a.471.471 0 0 0 .17-.361c.002-.452.002-1.498.002-2.117a.471.471 0 0 1 .482-.472c.52.007 1.143.008 1.735.007Zm-2.217-9.424a.591.591 0 0 1 .59-.59h1.505a.59.59 0 0 1 .59.59v6.87a.59.59 0 0 1-.59.591h-1.504a.591.591 0 0 1-.59-.59v-6.87Z" fill="#fff" stroke="#000" stroke-width=".566" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M9.086 13.658v14.64c0 .17.09.325.237.41.598.284 2.331.964 5.37.964 3.06 0 4.743-.826 5.306-1.166a.47.47 0 0 0 .216-.396V13.658H9.087Z" fill="#FBB040"/><path d="M10.722 16.137v11.314" stroke="#FFDB96" stroke-width="1.302" stroke-linecap="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M17.01 16.662a.82.82 0 0 0-.367-.66 1.975 1.975 0 0 1-.82-.98c-3.022.102-5.78-.429-7.17-.803a11.605 11.605 0 0 0-1.082-.252 1.814 1.814 0 0 1-1.464-1.773c0-.967.767-1.752 1.725-1.787a2.189 2.189 0 1 1 4.217 1.117l.006.002a2.095 2.095 0 0 1 3.985-.016 2.277 2.277 0 0 1 4.436-.918l.199-.05a1.789 1.789 0 1 1 1.122 3.33 2.637 2.637 0 0 0-.578.15c-.518.195-1.048.357-1.584.491a1.964 1.964 0 0 1-.225.736 2.447 2.447 0 0 0-.281 1.33v.201c0 .585-.474.941-1.06.941a1.06 1.06 0 0 1-1.059-1.06Z" fill="#fff" stroke="#000" stroke-width=".566" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_429_2384"><path fill="#fff" d="M5.373 0h21.255v32H5.373z"/></clipPath></defs></svg>

public/static/images/logos/platform-linux.svg

···
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="Type=ubuntu"><path id="bg" d="M30 16C30 23.728 23.735 30 16 30C8.265 30 2 23.728 2 16C2 8.265 8.265 2 16 2C23.735 2 30 8.265 30 16Z" fill="#E95420"/><path id="ubuntu" d="M6.82154 14.1563C5.81185 14.1563 5 14.9865 5 16.0035C5 17.0205 5.81867 17.8507 6.82154 17.8507C7.82442 17.8507 8.64309 17.0205 8.64309 16.0035C8.64309 14.9795 7.82442 14.1563 6.82154 14.1563ZM19.8316 22.5482C18.9583 23.0602 18.665 24.1879 19.163 25.0734C19.6679 25.959 20.7799 26.2634 21.6531 25.7514C22.5264 25.2395 22.8197 24.1118 22.3217 23.2262C21.8101 22.3476 20.698 22.0432 19.8316 22.5482ZM10.7785 16.0035C10.7785 14.177 11.6722 12.565 13.0434 11.5896L11.7131 9.32725C10.1167 10.4065 8.93645 12.06 8.43842 13.9902C9.01149 14.4676 9.37989 15.194 9.37989 16.0035C9.37989 16.8129 9.01149 17.5393 8.43842 18.0167C8.92962 19.9469 10.1167 21.6004 11.7131 22.6797L13.0434 20.4174C11.6722 19.4419 10.7785 17.8299 10.7785 16.0035ZM16.0998 10.6071C18.8833 10.6071 21.1619 12.7657 21.4007 15.5261L24 15.4846C23.8704 13.4506 22.9971 11.6241 21.6463 10.282C20.9504 10.5449 20.1522 10.5034 19.4632 10.1021C18.7673 9.69393 18.3375 9.01593 18.2147 8.26875C17.5393 8.08195 16.8298 7.97817 16.0998 7.97817C14.8377 7.97817 13.6506 8.27566 12.5932 8.80838L13.8621 11.1053C14.5375 10.787 15.3016 10.6071 16.0998 10.6071ZM16.0998 21.3998C15.3016 21.3998 14.5375 21.2199 13.8553 20.9017L12.5864 23.1985C13.6438 23.7313 14.8377 24.0287 16.093 24.0287C16.823 24.0287 17.5325 23.925 18.2079 23.7382C18.3239 22.9979 18.7605 22.313 19.4564 21.9048C20.1454 21.4966 20.9504 21.462 21.6395 21.7249C22.9835 20.3828 23.8636 18.5563 23.9932 16.5223L21.3939 16.4808C21.1619 19.2343 18.8833 21.3998 16.0998 21.3998ZM19.8248 9.45178C20.698 9.96374 21.8101 9.65933 22.3149 8.77378C22.8197 7.88824 22.5196 6.76054 21.6463 6.24859C20.7731 5.73663 19.661 6.04104 19.1562 6.92659C18.6582 7.81213 18.9583 8.93983 19.8248 9.45178Z" fill="white"/></g></svg>

public/static/images/logos/platform-microsoft.svg

···
-<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#FEBA08" d="M17 17h10v10H17z"/><path fill="#05A6F0" d="M5 17h10v10H5z"/><path fill="#80BC06" d="M17 5h10v10H17z"/><path fill="#F25325" d="M5 5h10v10H5z"/></svg>

public/static/images/logos/platform-nvm.svg

···
-<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_423_27755)"><g clip-path="url(#clip1_423_27755)"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.46 9.846H.104l.792 1.39H2.25l-.792-1.39Z" fill="#333"/><path fill-rule="evenodd" clip-rule="evenodd" d="m11.499 14.19-.299-.563-.914-1.565-1.002.017.263.475-2.567.018-.562-.967-1.882.017 10.18 16 3.816-6.822-3.06-5.257-.316-.545-.703-1.213-2.954.404Z" fill="#333" stroke="#333" stroke-width=".352" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.976 12.642c.809-1.39 1.617-2.778 2.409-4.167.175-.3.386-.422.738-.422 2.356.017 4.712 0 7.05 0 .669 0 .845.263.563.879-.738 1.248-1.494 2.479-2.163 3.762-.79 1.354-1.582 2.69-2.373 4.044-1.74 3.025-3.481 6.049-5.24 9.055-.861 1.442-1.705 2.884-2.69 4.255-.21.3-.44.598-.686.862-.632.668-1.16.668-1.793-.018-.299-.316-1.266-1.723-.756-.896-.826-1.301-1.829-2.778-2.655-4.08.264-.615 3.165-5.855 3.921-7.173.088-.088 2.567-4.185 3.675-6.101Z" fill="#F4DD4B"/><path fill-rule="evenodd" clip-rule="evenodd" d="m13.398 25.917 4.009-7.368-1.09-1.828" fill="#000"/><path fill-rule="evenodd" clip-rule="evenodd" d="m5.503 7.508-1.125.017.686 1.125h.404l.633 1.055 1.846-.035-1.125-1.864-1.125.036-.194-.334ZM5.345 2.075l-1.108.017.668 1.108 1.108-.018-.668-1.107ZM3.376 3.64l-.932.017.563.914.932-.017-.563-.915ZM7.314.193l-.773.018.404.668.774-.018-.405-.668ZM5.521 5.24l-.985.035.51.844.985-.036-.51-.844ZM10.303 5.785l-1.582.035-.264-.422-1.424.035.756 1.23.967-.017.739 1.213 2.04-.035-1.232-2.04ZM8.633 3.042l-1.372.035.721 1.196 1.372-.036-.721-1.195ZM2.567.527l-.633.018.334.545.633-.018-.334-.545ZM13.011 10.022l-2.514.053.51.809h.756l.475.756 1.74-.036-.967-1.582ZM3.147 5.714l-.773.018.404.668.774-.018-.405-.668Z" fill="#333" stroke="#333" stroke-width=".352" stroke-linecap="round" stroke-linejoin="round"/></g></g><defs><clipPath id="clip0_423_27755"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath><clipPath id="clip1_423_27755"><path fill="#fff" d="M0 0h32v31.473H0z"/></clipPath></defs></svg>

public/static/images/logos/platform-placeholder.svg

···
-<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 29.333c7.364 0 13.333-5.97 13.333-13.333 0-7.364-5.97-13.334-13.333-13.334C8.636 2.666 2.667 8.636 2.667 16S8.637 29.333 16 29.333Z" stroke="#000" stroke-width="2.667" stroke-linecap="round" stroke-linejoin="round"/></svg>

public/static/images/logos/social-github-dark.svg

···
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="Social Icon"><path id="Vector" d="M10 1.25C5.16562 1.25 1.25 5.16562 1.25 10C1.25 13.8719 3.75469 17.1422 7.23281 18.3016C7.67031 18.3781 7.83437 18.1156 7.83437 17.8859C7.83437 17.6781 7.82344 16.9891 7.82344 16.2563C5.625 16.6609 5.05625 15.7203 4.88125 15.2281C4.78281 14.9766 4.35625 14.2 3.98438 13.9922C3.67812 13.8281 3.24063 13.4234 3.97344 13.4125C4.6625 13.4016 5.15469 14.0469 5.31875 14.3094C6.10625 15.6328 7.36406 15.2609 7.86719 15.0312C7.94375 14.4625 8.17344 14.0797 8.425 13.8609C6.47813 13.6422 4.44375 12.8875 4.44375 9.54062C4.44375 8.58906 4.78281 7.80156 5.34062 7.18906C5.25313 6.97031 4.94687 6.07344 5.42812 4.87031C5.42812 4.87031 6.16094 4.64063 7.83437 5.76719C8.53438 5.57031 9.27813 5.47187 10.0219 5.47187C10.7656 5.47187 11.5094 5.57031 12.2094 5.76719C13.8828 4.62969 14.6156 4.87031 14.6156 4.87031C15.0969 6.07344 14.7906 6.97031 14.7031 7.18906C15.2609 7.80156 15.6 8.57812 15.6 9.54062C15.6 12.8984 13.5547 13.6422 11.6078 13.8609C11.925 14.1344 12.1984 14.6594 12.1984 15.4797C12.1984 16.65 12.1875 17.5906 12.1875 17.8859C12.1875 18.1156 12.3516 18.3891 12.7891 18.3016C14.5261 17.7152 16.0355 16.5988 17.1048 15.1096C18.1741 13.6204 18.7495 11.8333 18.75 10C18.75 5.16562 14.8344 1.25 10 1.25Z" fill="#2C3437"/></g></svg>

public/static/images/logos/social-github.svg

···
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 1.25C5.16562 1.25 1.25 5.16562 1.25 10C1.25 13.8719 3.75469 17.1422 7.23281 18.3016C7.67031 18.3781 7.83437 18.1156 7.83437 17.8859C7.83437 17.6781 7.82344 16.9891 7.82344 16.2563C5.625 16.6609 5.05625 15.7203 4.88125 15.2281C4.78281 14.9766 4.35625 14.2 3.98438 13.9922C3.67812 13.8281 3.24063 13.4234 3.97344 13.4125C4.6625 13.4016 5.15469 14.0469 5.31875 14.3094C6.10625 15.6328 7.36406 15.2609 7.86719 15.0312C7.94375 14.4625 8.17344 14.0797 8.425 13.8609C6.47813 13.6422 4.44375 12.8875 4.44375 9.54062C4.44375 8.58906 4.78281 7.80156 5.34062 7.18906C5.25313 6.97031 4.94687 6.07344 5.42812 4.87031C5.42812 4.87031 6.16094 4.64063 7.83437 5.76719C8.53438 5.57031 9.27813 5.47187 10.0219 5.47187C10.7656 5.47187 11.5094 5.57031 12.2094 5.76719C13.8828 4.62969 14.6156 4.87031 14.6156 4.87031C15.0969 6.07344 14.7906 6.97031 14.7031 7.18906C15.2609 7.80156 15.6 8.57812 15.6 9.54062C15.6 12.8984 13.5547 13.6422 11.6078 13.8609C11.925 14.1344 12.1984 14.6594 12.1984 15.4797C12.1984 16.65 12.1875 17.5906 12.1875 17.8859C12.1875 18.1156 12.3516 18.3891 12.7891 18.3016C14.5261 17.7152 16.0355 16.5988 17.1048 15.1096C18.1741 13.6204 18.7495 11.8333 18.75 10C18.75 5.16562 14.8344 1.25 10 1.25Z" fill="white"/></svg>

public/static/images/logos/social-linkedin.svg

···
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="Social Icon"><rect id="bg" width="20" height="20" rx="10" fill="#1275B1"/><g id="linked_in"><path d="M7.58468 5.49444C7.58468 6.16198 7.00608 6.70312 6.29234 6.70312C5.5786 6.70312 5 6.16198 5 5.49444C5 4.82691 5.5786 4.28577 6.29234 4.28577C7.00608 4.28577 7.58468 4.82691 7.58468 5.49444Z" fill="white"/><path d="M5.17673 7.59155H7.38586V14.2858H5.17673V7.59155Z" fill="white"/><path d="M10.9426 7.59155H8.73343V14.2858H10.9426C10.9426 14.2858 10.9426 12.1783 10.9426 10.8607C10.9426 10.0698 11.2126 9.27544 12.2901 9.27544C13.5079 9.27544 13.5005 10.3104 13.4949 11.1123C13.4874 12.1604 13.5052 13.2299 13.5052 14.2858H15.7143V10.7527C15.6956 8.49675 15.1077 7.45725 13.1738 7.45725C12.0253 7.45725 11.3134 7.97867 10.9426 8.4504V7.59155Z" fill="white"/></g></g></svg>

public/static/images/logos/social-mastodon.svg

···
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none"><g clip-path="url(#a)"><path fill="#2B90D9" fill-rule="evenodd" d="M14.296 15.244c2.506-.3 4.688-1.843 4.963-3.254.432-2.223.396-5.424.396-5.424 0-4.338-2.843-5.61-2.843-5.61C15.38.298 12.918.021 10.363 0h-.064c-2.556.02-5.016.298-6.45.956 0 0-2.842 1.272-2.842 5.61l-.003.828c-.004.8-.008 1.687.015 2.613.103 4.243.778 8.425 4.7 9.463 1.81.48 3.363.58 4.613.51 2.268-.125 3.542-.809 3.542-.809l-.075-1.646s-1.621.512-3.441.45c-1.804-.063-3.708-.195-4-2.41a4.54 4.54 0 0 1-.04-.62s1.77.432 4.014.535c1.372.063 2.659-.08 3.966-.236Zm2.007-3.088V6.903c0-1.074-.274-1.927-.823-2.558-.566-.631-1.308-.955-2.228-.955-1.065 0-1.872.41-2.405 1.228l-.518.87-.519-.87C9.277 3.8 8.47 3.39 7.405 3.39c-.92 0-1.662.324-2.228.955-.549.631-.822 1.484-.822 2.558v5.253h2.08V7.057c0-1.075.453-1.62 1.358-1.62 1 0 1.501.647 1.501 1.927v2.79h2.07v-2.79c0-1.28.5-1.927 1.5-1.927.905 0 1.357.545 1.357 1.62v5.1h2.082Z" clip-rule="evenodd"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h20v20H0z"/></clipPath></defs></svg>

public/static/images/logos/social-slack.svg

···
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none"><path fill="#2EB67D" d="M16.563 9.375A1.562 1.562 0 1 0 15 7.813v1.562h1.563Zm-4.375 0c.862 0 1.562-.7 1.562-1.563V3.438a1.563 1.563 0 0 0-3.125 0v4.374c0 .863.7 1.563 1.563 1.563Z"/><path fill="#E01E5A" d="M3.437 10.625A1.562 1.562 0 1 0 5 12.187v-1.562H3.437Zm4.376 0c-.863 0-1.563.7-1.563 1.563v4.374a1.563 1.563 0 0 0 3.125 0v-4.374c0-.863-.7-1.563-1.563-1.563Z"/><path fill="#ECB22E" d="M10.625 16.563A1.562 1.562 0 1 0 12.187 15h-1.562v1.563Zm0-4.375c0 .862.7 1.562 1.563 1.562h4.374a1.562 1.562 0 1 0 0-3.125h-4.374c-.863 0-1.563.7-1.563 1.563Z"/><path fill="#36C5F0" d="M9.375 3.437A1.562 1.562 0 1 0 7.813 5h1.562V3.437Zm0 4.376c0-.863-.7-1.563-1.563-1.563H3.438a1.563 1.563 0 0 0 0 3.125h4.374c.863 0 1.563-.7 1.563-1.563Z"/></svg>

public/static/images/logos/social-twitter.svg

···
-<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.278 18.429c-2.311 0-4.465-.672-6.278-1.832 1.54.1 4.256-.14 5.945-1.75-2.541-.117-3.688-2.067-3.837-2.9.216.083 1.246.183 1.827-.05C1.011 11.164.563 8.598.662 7.815c.549.383 1.479.516 1.845.483C-.218 6.348.762 3.416 1.244 2.783c1.955 2.709 4.885 4.23 8.51 4.315a4.19 4.19 0 0 1-.104-.933A4.16 4.16 0 0 1 13.803 2c1.199 0 2.279.51 3.037 1.323.8-.187 2.006-.627 2.595-1.006-.297 1.066-1.221 1.955-1.78 2.285-.005-.011.004.011 0 0 .49-.074 1.82-.33 2.345-.686-.26.6-1.24 1.595-2.044 2.153.15 6.601-4.901 12.36-11.678 12.36Z" fill="#47ACDF"/></svg>

public/static/images/logos/stacked-black.svg

···
-<svg width="267" height="164" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_337_7902)"><mask id="mask0_337_7902" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="267" height="164"><path d="M267 0H0v164h267V0Z" fill="#fff"/></mask><g mask="url(#mask0_337_7902)"><path d="M131.991 164c-.905 0-1.75-.242-2.534-.666l-8.027-4.78c-1.207-.666-.604-.908-.242-1.029 1.63-.545 1.931-.666 3.621-1.634.181-.121.423-.061.604.06l6.156 3.692c.241.121.543.121.724 0l24.141-13.98c.242-.121.362-.363.362-.665V117.1c0-.303-.12-.545-.362-.666l-24.081-13.919c-.241-.121-.543-.121-.724 0l-24.08 13.919c-.242.121-.363.424-.363.666v27.898c0 .242.121.544.363.665l6.578 3.813c3.561 1.816 5.794-.303 5.794-2.421V119.52c0-.363.302-.726.724-.726h3.078c.362 0 .724.303.724.726v27.535c0 4.781-2.595 7.565-7.121 7.565-1.388 0-2.475 0-5.553-1.513l-6.337-3.631a5.11 5.11 0 0 1-2.535-4.418V117.16c0-1.815.966-3.51 2.535-4.418l24.141-13.979c1.509-.847 3.561-.847 5.07 0l24.141 13.979a5.112 5.112 0 0 1 2.535 4.418v27.898a5.11 5.11 0 0 1-2.535 4.418l-24.141 13.979c-.905.303-1.811.545-2.656.545Z" fill="#5FA04E"/><path d="M139.415 144.756c-10.562 0-12.735-4.842-12.735-8.957 0-.363.302-.726.724-.726h3.139c.362 0 .664.242.664.605.482 3.208 1.871 4.781 8.268 4.781 5.07 0 7.242-1.15 7.242-3.873 0-1.573-.603-2.723-8.509-3.51-6.579-.666-10.683-2.118-10.683-7.383 0-4.902 4.104-7.807 10.984-7.807 7.725 0 11.528 2.663 12.01 8.473 0 .181-.06.363-.181.544-.12.121-.301.242-.482.242h-3.199a.707.707 0 0 1-.664-.544c-.724-3.329-2.595-4.418-7.544-4.418-5.553 0-6.216 1.937-6.216 3.389 0 1.755.784 2.3 8.268 3.268 7.423.968 10.924 2.36 10.924 7.625 0 5.265-4.346 8.291-12.01 8.291ZM174.178 115.466c0 2.541-2.113 4.659-4.648 4.659a4.655 4.655 0 0 1-4.647-4.659c0-2.663 2.173-4.66 4.647-4.66a4.656 4.656 0 0 1 4.648 4.66Zm-8.51 0c0 2.178 1.75 3.933 3.862 3.933 2.173 0 3.923-1.815 3.923-3.933 0-2.179-1.75-3.873-3.923-3.873a3.855 3.855 0 0 0-3.862 3.873Zm2.112-2.603h1.811c.603 0 1.81 0 1.81 1.392 0 .969-.603 1.15-.965 1.271.724.061.784.545.845 1.211.06.423.12 1.149.241 1.391h-1.086c0-.242-.181-1.573-.181-1.634-.061-.302-.181-.423-.543-.423h-.906v2.118h-1.026v-5.326Zm1.026 2.3h.785c.664 0 .784-.484.784-.726 0-.726-.482-.726-.784-.726h-.845v1.452h.06Z" fill="#5FA04E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M57.275 54.828a3.08 3.08 0 0 0-1.57-2.663L30.177 37.34c-.422-.242-.905-.363-1.388-.424h-.241c-.483 0-.966.182-1.388.424L1.569 52.105A3.105 3.105 0 0 0 0 54.828l.06 39.699c0 .545.302 1.09.785 1.331.483.303 1.086.303 1.509 0l15.209-8.714a3.08 3.08 0 0 0 1.569-2.663V65.903A3.08 3.08 0 0 1 20.7 63.24l6.458-3.752c.483-.303 1.026-.424 1.569-.424.543 0 1.086.121 1.509.424l6.457 3.752a3.08 3.08 0 0 1 1.57 2.663V84.48a3.08 3.08 0 0 0 1.569 2.663l15.088 8.714a1.47 1.47 0 0 0 1.57 0c.482-.242.784-.786.784-1.331V54.828ZM180.334.182c-.483-.243-1.087-.243-1.509 0-.483.302-.785.786-.785 1.33V40.85c0 .363-.181.726-.543.968a1.151 1.151 0 0 1-1.086 0l-6.397-3.691a3.103 3.103 0 0 0-3.078 0l-25.59 14.826a3.08 3.08 0 0 0-1.569 2.663v29.592a3.08 3.08 0 0 0 1.569 2.663l25.59 14.827a3.107 3.107 0 0 0 3.078 0l25.589-14.827a3.08 3.08 0 0 0 1.569-2.663v-73.77c0-1.15-.603-2.178-1.569-2.723L180.334.182Zm-2.414 75.282c0 .303-.121.545-.362.666l-8.752 5.083a.892.892 0 0 1-.784 0l-8.751-5.083c-.242-.121-.362-.424-.362-.666V65.297c0-.302.12-.544.362-.665l8.751-5.084a.892.892 0 0 1 .784 0l8.752 5.084c.241.12.362.423.362.665v10.167ZM265.491 65.055c.966-.544 1.509-1.573 1.509-2.662V55.19c0-1.09-.603-2.118-1.509-2.663l-25.408-14.766a3.103 3.103 0 0 0-3.078 0l-25.59 14.827a3.082 3.082 0 0 0-1.569 2.663v29.592c0 1.09.604 2.118 1.569 2.663l25.409 14.524c.965.545 2.112.545 3.017 0l15.39-8.593c.483-.242.785-.787.785-1.332 0-.544-.302-1.089-.785-1.331l-25.71-14.827c-.483-.302-.784-.786-.784-1.331v-9.26c0-.544.301-1.088.784-1.33l8.027-4.6a1.47 1.47 0 0 1 1.569 0l8.027 4.6c.483.302.785.786.785 1.33v7.263c0 .545.301 1.09.784 1.331a1.47 1.47 0 0 0 1.569 0l15.209-8.896Z" fill="#333"/><path fill-rule="evenodd" clip-rule="evenodd" d="M238.152 63.663a.546.546 0 0 1 .603 0l4.889 2.845a.636.636 0 0 1 .302.544v5.689a.636.636 0 0 1-.302.545l-4.889 2.844a.546.546 0 0 1-.603 0l-4.889-2.844a.636.636 0 0 1-.302-.545v-5.689c0-.242.121-.423.302-.544l4.889-2.844Z" fill="#5FA04E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M96.987 37.883a3.104 3.104 0 0 1 3.078 0l25.348 14.706c.966.545 1.509 1.573 1.509 2.663v29.35c0 1.09-.604 2.118-1.509 2.663l-25.348 14.705a3.102 3.102 0 0 1-3.078 0L71.639 87.265c-.966-.545-1.51-1.573-1.51-2.663v-29.41c0-1.09.604-2.119 1.51-2.664l25.348-14.645Z" fill="url(#paint0_linear_337_7902)"/><path opacity=".66" d="m125.292 52.528-25.227-14.705a4.192 4.192 0 0 0-.785-.303L70.733 86.54c.242.302.544.544.845.726l25.409 14.706c.784.423 1.63.544 2.414.242l26.676-48.958c-.181-.303-.483-.545-.785-.727Z" fill="#B4B4B4"/><path d="m100.004 101.97 25.288-14.705c.966-.545 1.388-1.573 1.388-2.663v-.12L99.28 37.58c-.784-.242-1.63-.121-2.353.302L71.82 52.407l27.28 49.866a3.12 3.12 0 0 0 .904-.303Z" fill="url(#paint1_linear_337_7902)"/></g></g><defs><linearGradient id="paint0_linear_337_7902" x1="70.117" y1="69.914" x2="126.971" y2="69.914" gradientUnits="userSpaceOnUse"><stop offset=".005"/><stop offset=".194" stop-color="#171717"/><stop offset=".542" stop-color="#3D3D3D"/><stop offset=".824" stop-color="#545454"/><stop offset="1" stop-color="#5C5C5C"/></linearGradient><linearGradient id="paint1_linear_337_7902" x1="69.724" y1="69.872" x2="128.373" y2="69.872" gradientUnits="userSpaceOnUse"><stop stop-color="#5C5C5C"/><stop offset=".176" stop-color="#545454"/><stop offset=".458" stop-color="#3D3D3D"/><stop offset=".806" stop-color="#171717"/><stop offset=".995"/></linearGradient><clipPath id="clip0_337_7902"><path fill="#fff" d="M0 0h267v164H0z"/></clipPath></defs></svg>

public/static/images/logos/stacked-dark.svg

···
-<svg width="289" height="177" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_337_7900)"><mask id="mask0_337_7900" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="289" height="177"><path d="M289 0H0v177h289V0Z" fill="#fff"/></mask><g mask="url(#mask0_337_7900)"><path d="M142.802 177c-.98 0-1.895-.261-2.744-.719l-8.688-5.161c-1.307-.719-.653-.98-.262-1.111 1.764-.588 2.091-.719 3.92-1.764.196-.131.457-.066.653.065l6.663 3.986c.262.13.588.13.784 0l26.065-15.093c.262-.131.392-.392.392-.719v-30.121c0-.326-.13-.588-.392-.718l-26.065-15.028c-.261-.131-.588-.131-.784 0l-26.064 15.028c-.262.13-.392.457-.392.718v30.121c0 .261.13.588.392.719l7.12 4.116c3.854 1.96 6.271-.327 6.271-2.614v-29.728c0-.392.327-.784.784-.784h3.332c.392 0 .784.326.784.784v29.728c0 5.162-2.809 8.168-7.709 8.168-1.502 0-2.678 0-6.01-1.634l-6.859-3.92a5.515 5.515 0 0 1-2.743-4.77v-30.12a5.514 5.514 0 0 1 2.743-4.77l26.065-15.093c1.633-.915 3.854-.915 5.487 0l26.065 15.093a5.513 5.513 0 0 1 2.744 4.77v30.12c0 1.96-1.045 3.79-2.744 4.77l-26.065 15.093c-.784.327-1.763.588-2.743.588Z" fill="#5FA04E"/><path d="M150.902 156.288c-11.432 0-13.784-5.227-13.784-9.67 0-.392.327-.784.784-.784h3.397c.392 0 .719.261.719.653.522 3.463 2.025 5.162 8.949 5.162 5.488 0 7.839-1.241 7.839-4.182 0-1.698-.653-2.94-9.211-3.789-7.12-.719-11.562-2.287-11.562-7.971 0-5.293 4.442-8.429 11.889-8.429 8.362 0 12.477 2.875 13 9.147 0 .196-.066.392-.196.588-.131.131-.327.262-.523.262h-3.462a.767.767 0 0 1-.719-.588c-.784-3.594-2.809-4.77-8.165-4.77-6.01 0-6.729 2.091-6.729 3.659 0 1.895.849 2.483 8.95 3.528 8.035 1.045 11.824 2.548 11.824 8.167 0 5.75-4.769 9.017-13 9.017ZM188.529 124.664c0 2.745-2.286 5.031-5.03 5.031-2.743 0-5.03-2.221-5.03-5.031 0-2.874 2.352-5.031 5.03-5.031 2.679 0 5.03 2.222 5.03 5.031Zm-9.276 0c0 2.353 1.895 4.247 4.181 4.247 2.352 0 4.246-1.96 4.246-4.247 0-2.352-1.894-4.181-4.246-4.181-2.221 0-4.181 1.829-4.181 4.181Zm2.352-2.809h1.96c.653 0 1.959 0 1.959 1.503 0 1.045-.653 1.241-1.045 1.372.784.065.849.588.915 1.307.065.457.13 1.241.261 1.502h-1.176c0-.261-.196-1.698-.196-1.764-.065-.326-.196-.457-.588-.457h-.98v2.287h-1.11v-5.75Zm1.045 2.483h.849c.719 0 .85-.523.85-.784 0-.784-.523-.784-.85-.784h-.914v1.568h.065Z" fill="#5FA04E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M61.994 59.196a3.324 3.324 0 0 0-1.699-2.875L32.663 40.313c-.457-.26-.98-.392-1.503-.457H30.9c-.523 0-1.045.196-1.503.457L1.698 56.256A3.35 3.35 0 0 0 0 59.196l.065 42.862c0 .588.327 1.176.85 1.437.522.327 1.175.327 1.633 0l16.462-9.409a3.324 3.324 0 0 0 1.698-2.874v-20.06c0-1.175.653-2.286 1.699-2.874l6.99-4.051c.522-.327 1.11-.457 1.698-.457.588 0 1.176.13 1.633.457l6.99 4.051a3.324 3.324 0 0 1 1.698 2.875V91.21c0 1.177.654 2.287 1.699 2.875l16.331 9.409a1.593 1.593 0 0 0 1.699 0c.522-.261.849-.849.849-1.437V59.196ZM195.127.196c-.522-.261-1.176-.261-1.633 0-.522.327-.849.85-.849 1.437v42.47c0 .392-.196.784-.588 1.045a1.25 1.25 0 0 1-1.176 0l-6.924-3.985a3.367 3.367 0 0 0-3.332 0L152.927 57.17a3.325 3.325 0 0 0-1.698 2.874v31.95c0 1.177.653 2.287 1.698 2.875l27.698 16.008a3.367 3.367 0 0 0 3.332 0l27.698-16.008a3.324 3.324 0 0 0 1.698-2.874V12.349a3.35 3.35 0 0 0-1.698-2.94L195.127.196Zm-2.547 81.28c0 .327-.131.588-.392.719l-9.473 5.488a.968.968 0 0 1-.849 0l-9.472-5.488c-.261-.13-.392-.457-.392-.719V70.5c0-.326.131-.588.392-.718l9.472-5.489a.968.968 0 0 1 .849 0l9.473 5.489c.261.13.392.457.392.718v10.977ZM287.301 70.238c1.046-.588 1.634-1.699 1.634-2.875v-7.775a3.404 3.404 0 0 0-1.634-2.875l-27.502-15.942a3.365 3.365 0 0 0-3.331 0L228.77 56.779a3.325 3.325 0 0 0-1.699 2.874v31.95c0 1.177.654 2.287 1.699 2.875l27.502 15.681c1.045.589 2.286.589 3.266 0l16.658-9.277c.523-.262.849-.85.849-1.438s-.326-1.176-.849-1.437l-27.829-16.008c-.522-.327-.849-.85-.849-1.438v-9.996c0-.588.327-1.176.849-1.438l8.689-4.965a1.593 1.593 0 0 1 1.698 0l8.688 4.965c.523.327.85.85.85 1.438v7.84c0 .588.326 1.176.849 1.438a1.594 1.594 0 0 0 1.698 0l16.462-9.605Z" fill="#333"/><path fill-rule="evenodd" clip-rule="evenodd" d="M257.709 68.735a.593.593 0 0 1 .653 0l5.291 3.071c.196.13.327.327.327.588v6.142a.686.686 0 0 1-.327.588l-5.291 3.07a.593.593 0 0 1-.653 0l-5.292-3.07a.685.685 0 0 1-.326-.588v-6.142c0-.261.13-.457.326-.588l5.292-3.07Z" fill="#5FA04E"/><path d="M108.31 40.901a3.367 3.367 0 0 0-3.332 0L77.476 56.778c-1.045.589-1.633 1.7-1.633 2.875v31.82c0 1.176.653 2.287 1.633 2.875l27.502 15.877a3.367 3.367 0 0 0 3.332 0l27.502-15.877c1.045-.588 1.633-1.7 1.633-2.875v-31.82a3.406 3.406 0 0 0-1.633-2.874L108.31 40.9Z" fill="url(#paint0_linear_337_7900)"/><path d="M135.877 56.779 108.244 40.9a4.543 4.543 0 0 0-.849-.326L76.5 93.5c.261.327.673.804 1 1l27.478 15.725c.784.457 1.698.588 2.548.326l29.069-53.184a2.044 2.044 0 0 0-.718-.588Z" fill="url(#paint1_linear_337_7900)"/><path d="m104.063 35.086-.392.196h.523l-.131-.196Z" fill="url(#paint2_linear_337_7900)"/><path d="M135.809 94.348c.784-.458 1.491-1.315 1.491-2.348l-30.104-51.49c-.784-.131-1.633-.066-2.352.391L77.408 56.713 107 110.682a4.54 4.54 0 0 0 1.241-.392l27.568-15.942Z" fill="url(#paint3_linear_337_7900)"/></g></g><defs><linearGradient id="paint0_linear_337_7900" x1="117.844" y1="52.726" x2="92.971" y2="103.459" gradientUnits="userSpaceOnUse"><stop stop-color="#3F873F"/><stop offset=".33" stop-color="#3F8B3D"/><stop offset=".637" stop-color="#3E9638"/><stop offset=".934" stop-color="#3DA92E"/><stop offset="1" stop-color="#3DAE2B"/></linearGradient><linearGradient id="paint1_linear_337_7900" x1="102.464" y1="79.278" x2="172.246" y2="27.73" gradientUnits="userSpaceOnUse"><stop offset=".138" stop-color="#3F873F"/><stop offset=".402" stop-color="#52A044"/><stop offset=".713" stop-color="#64B749"/><stop offset=".908" stop-color="#6ABF4B"/></linearGradient><linearGradient id="paint2_linear_337_7900" x1="74.834" y1="35.163" x2="138.473" y2="35.163" gradientUnits="userSpaceOnUse"><stop offset=".092" stop-color="#6ABF4B"/><stop offset=".287" stop-color="#64B749"/><stop offset=".598" stop-color="#52A044"/><stop offset=".862" stop-color="#3F873F"/></linearGradient><linearGradient id="paint3_linear_337_7900" x1="74.835" y1="75.553" x2="138.473" y2="75.553" gradientUnits="userSpaceOnUse"><stop offset=".092" stop-color="#6ABF4B"/><stop offset=".287" stop-color="#64B749"/><stop offset=".598" stop-color="#52A044"/><stop offset=".862" stop-color="#3F873F"/></linearGradient><clipPath id="clip0_337_7900"><path fill="#fff" d="M0 0h289v177H0z"/></clipPath></defs></svg>

public/static/images/logos/stacked-light.svg

···
-<svg width="319" height="195" viewBox="0 0 319 195" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_337_7901)"><mask id="mask0_337_7901" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="319" height="195"><path d="M319 0H0V195H319V0Z" fill="white"/></mask><g mask="url(#mask0_337_7901)"><path d="M157.625 195C156.544 195 155.534 194.712 154.597 194.208L145.007 188.522C143.565 187.73 144.286 187.442 144.718 187.298C146.665 186.65 147.026 186.506 149.045 185.354C149.261 185.21 149.549 185.282 149.766 185.426L157.121 189.817C157.409 189.961 157.77 189.961 157.986 189.817L186.756 173.189C187.045 173.045 187.189 172.757 187.189 172.398V139.214C187.189 138.854 187.045 138.566 186.756 138.422L157.986 121.866C157.697 121.722 157.337 121.722 157.121 121.866L128.35 138.422C128.062 138.566 127.917 138.926 127.917 139.214V172.398C127.917 172.686 128.062 173.045 128.35 173.189L136.21 177.724C140.464 179.884 143.132 177.364 143.132 174.845V142.093C143.132 141.661 143.492 141.229 143.997 141.229H147.675C148.107 141.229 148.54 141.589 148.54 142.093V174.845C148.54 180.532 145.439 183.843 140.031 183.843C138.373 183.843 137.075 183.843 133.398 182.043L125.826 177.724C123.952 176.645 122.798 174.629 122.798 172.47V139.286C122.798 137.126 123.952 135.111 125.826 134.031L154.597 117.403C156.4 116.395 158.851 116.395 160.654 117.403L189.424 134.031C191.299 135.111 192.453 137.126 192.453 139.286V172.47C192.453 174.629 191.299 176.645 189.424 177.724L160.654 194.352C159.789 194.712 158.707 195 157.625 195Z" fill="#5FA04E"/><path d="M166.567 172.182C153.948 172.182 151.352 166.423 151.352 161.528C151.352 161.096 151.713 160.664 152.217 160.664H155.967C156.4 160.664 156.76 160.952 156.76 161.384C157.337 165.199 158.995 167.071 166.639 167.071C172.696 167.071 175.291 165.703 175.291 162.464C175.291 160.592 174.57 159.225 165.124 158.289C157.265 157.497 152.362 155.77 152.362 149.507C152.362 143.677 157.265 140.221 165.485 140.221C174.715 140.221 179.257 143.389 179.834 150.299C179.834 150.515 179.762 150.731 179.618 150.947C179.474 151.091 179.257 151.235 179.041 151.235H175.219C174.859 151.235 174.498 150.947 174.426 150.587C173.561 146.628 171.326 145.332 165.413 145.332C158.779 145.332 157.986 147.636 157.986 149.363C157.986 151.451 158.923 152.099 167.864 153.25C176.734 154.402 180.916 156.058 180.916 162.248C180.916 168.583 175.652 172.182 166.567 172.182Z" fill="#5FA04E"/><path d="M208.1 137.342C208.1 140.365 205.576 142.885 202.548 142.885C199.519 142.885 196.996 140.437 196.996 137.342C196.996 134.175 199.591 131.8 202.548 131.8C205.504 131.8 208.1 134.247 208.1 137.342ZM197.861 137.342C197.861 139.934 199.952 142.021 202.476 142.021C205.072 142.021 207.163 139.862 207.163 137.342C207.163 134.751 205.072 132.735 202.476 132.735C200.024 132.735 197.861 134.751 197.861 137.342ZM200.457 134.247H202.62C203.341 134.247 204.783 134.247 204.783 135.903C204.783 137.054 204.062 137.27 203.629 137.414C204.495 137.486 204.567 138.062 204.639 138.854C204.711 139.358 204.783 140.221 204.927 140.509H203.629C203.629 140.221 203.413 138.638 203.413 138.566C203.341 138.206 203.197 138.062 202.764 138.062H201.683V140.581H200.457V134.247ZM201.61 136.982H202.548C203.341 136.982 203.485 136.406 203.485 136.118C203.485 135.255 202.908 135.255 202.548 135.255H201.538V136.982H201.61Z" fill="#5FA04E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M68.4293 65.2159C68.4293 63.9203 67.7082 62.6966 66.5545 62.0487L36.0533 44.4131C35.5486 44.1251 34.9717 43.9812 34.3949 43.9092C34.3228 43.9092 34.1065 43.9092 34.1065 43.9092C33.5296 43.9092 32.9528 44.1251 32.448 44.4131L1.87477 61.9767C0.721067 62.6246 0 63.8483 0 65.2159L0.0721067 112.436C0.0721067 113.084 0.43264 113.732 1.00949 114.02C1.58635 114.38 2.30741 114.38 2.81216 114.02L20.983 103.654C22.1368 103.007 22.8578 101.783 22.8578 100.487V78.3887C22.8578 77.093 23.5789 75.8693 24.7326 75.2215L32.448 70.7586C33.0249 70.3987 33.6738 70.2547 34.3228 70.2547C34.9717 70.2547 35.6207 70.3987 36.1255 70.7586L43.8409 75.2215C44.9946 75.8693 45.7156 77.093 45.7156 78.3887V100.487C45.7156 101.783 46.4367 103.007 47.5904 103.654L65.6171 114.02C66.1939 114.38 66.915 114.38 67.4919 114.02C68.0687 113.732 68.4293 113.084 68.4293 112.436V65.2159Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M215.382 0.215947C214.806 -0.0719823 214.085 -0.0719823 213.58 0.215947C213.003 0.575858 212.642 1.15172 212.642 1.79956V48.588C212.642 49.0199 212.426 49.4518 211.993 49.7398C211.561 49.9557 211.128 49.9557 210.696 49.7398L203.052 45.3488C201.899 44.701 200.528 44.701 199.375 45.3488L168.802 62.9845C167.648 63.6323 166.927 64.856 166.927 66.1517V101.351C166.927 102.647 167.648 103.87 168.802 104.518L199.375 122.154C200.528 122.802 201.899 122.802 203.052 122.154L233.625 104.518C234.779 103.87 235.5 102.647 235.5 101.351V13.6047C235.5 12.237 234.779 11.0133 233.625 10.3654L215.382 0.215947ZM212.57 89.7619C212.57 90.1218 212.426 90.4098 212.138 90.5537L201.682 96.6002C201.394 96.7442 201.033 96.7442 200.745 96.6002L190.289 90.5537C190.001 90.4098 189.857 90.0498 189.857 89.7619V77.6689C189.857 77.309 190.001 77.021 190.289 76.8771L200.745 70.8306C201.033 70.6866 201.394 70.6866 201.682 70.8306L212.138 76.8771C212.426 77.021 212.57 77.381 212.57 77.6689V89.7619Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M317.125 77.3809C318.279 76.7331 318.928 75.5094 318.928 74.2137V65.6478C318.928 64.3522 318.207 63.1285 317.125 62.4806L286.769 44.9169C285.615 44.2691 284.245 44.2691 283.091 44.9169L252.518 62.5526C251.364 63.2004 250.643 64.4241 250.643 65.7198V100.919C250.643 102.215 251.364 103.439 252.518 104.086L282.875 121.362C284.028 122.01 285.398 122.01 286.48 121.362L304.867 111.141C305.444 110.853 305.805 110.205 305.805 109.557C305.805 108.909 305.444 108.261 304.867 107.973L274.15 90.3378C273.573 89.9778 273.212 89.402 273.212 88.7542V77.7409C273.212 77.093 273.573 76.4452 274.15 76.1573L283.74 70.6866C284.317 70.3267 285.038 70.3267 285.615 70.6866L295.205 76.1573C295.782 76.5172 296.142 77.093 296.142 77.7409V86.3787C296.142 87.0266 296.503 87.6744 297.08 87.9623C297.657 88.3223 298.378 88.3223 298.955 87.9623L317.125 77.3809Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M284.461 75.7253C284.677 75.5814 284.966 75.5814 285.182 75.7253L291.023 79.1085C291.239 79.2525 291.383 79.4684 291.383 79.7564V86.5227C291.383 86.8106 291.239 87.0266 291.023 87.1705L285.182 90.5537C284.966 90.6977 284.677 90.6977 284.461 90.5537L278.62 87.1705C278.404 87.0266 278.26 86.8106 278.26 86.5227V79.7564C278.26 79.4684 278.404 79.2525 278.62 79.1085L284.461 75.7253Z" fill="#5FA04E"/><path d="M119.445 44.5068C118.271 43.8467 116.878 43.8467 115.705 44.5068L84.8332 62.3292C83.6599 62.9892 83 64.2361 83 65.5563V101.275C83 102.595 83.7332 103.841 84.8332 104.502L115.705 122.324C116.878 122.984 118.271 122.984 119.445 122.324L150.317 104.502C151.49 103.841 152.15 102.595 152.15 101.275V65.5563C152.15 64.2361 151.416 62.9892 150.317 62.3292L119.445 44.5068Z" fill="url(#paint0_linear_337_7901)"/><path d="M150.39 62.3292L119.371 44.5067C119.078 44.3601 118.711 44.2134 118.418 44.14L83.7378 103.55C84.0311 103.917 84.4937 104.452 84.8603 104.672L115.705 122.324C116.585 122.837 117.611 122.984 118.565 122.69L151.196 62.9892C150.976 62.6959 150.683 62.4759 150.39 62.3292Z" fill="url(#paint1_linear_337_7901)"/><path d="M150.314 104.502C151.194 103.988 151.987 103.026 151.987 101.866L118.195 44.0667C117.315 43.92 116.362 43.9934 115.555 44.5068L84.7567 62.2559L117.975 122.837C118.415 122.764 118.928 122.617 119.368 122.397L150.314 104.502Z" fill="url(#paint2_linear_337_7901)"/></g></g><defs><linearGradient id="paint0_linear_337_7901" x1="130.147" y1="57.7802" x2="102.227" y2="114.729" gradientUnits="userSpaceOnUse"><stop stop-color="#3F873F"/><stop offset="0.3296" stop-color="#3F8B3D"/><stop offset="0.6367" stop-color="#3E9638"/><stop offset="0.9341" stop-color="#3DA92E"/><stop offset="1" stop-color="#3DAE2B"/></linearGradient><linearGradient id="paint1_linear_337_7901" x1="112.883" y1="87.586" x2="191.215" y2="29.7213" gradientUnits="userSpaceOnUse"><stop offset="0.1376" stop-color="#3F873F"/><stop offset="0.4016" stop-color="#52A044"/><stop offset="0.7129" stop-color="#64B749"/><stop offset="0.9081" stop-color="#6ABF4B"/></linearGradient><linearGradient id="paint2_linear_337_7901" x1="81.8683" y1="83.4042" x2="153.304" y2="83.4042" gradientUnits="userSpaceOnUse"><stop offset="0.0919165" stop-color="#6ABF4B"/><stop offset="0.2871" stop-color="#64B749"/><stop offset="0.5984" stop-color="#52A044"/><stop offset="0.8624" stop-color="#3F873F"/></linearGradient><clipPath id="clip0_337_7901"><rect width="319" height="195" fill="white"/></clipPath></defs></svg>

public/static/images/logos/stacked-white.svg

···
-<svg width="320" height="196" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_337_7903)"><mask id="mask0_337_7903" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="320" height="196"><path d="M320 0H0v196h320V0Z" fill="#fff"/></mask><g mask="url(#mask0_337_7903)"><path d="M158.119 196c-1.085 0-2.097-.289-3.038-.796l-9.62-5.716c-1.447-.795-.723-1.085-.289-1.23 1.953-.651 2.314-.795 4.34-1.953.217-.145.506-.072.723.072l7.378 4.414c.289.144.651.144.868 0l28.861-16.713c.289-.145.434-.435.434-.796v-33.354c0-.362-.145-.652-.434-.796l-28.861-16.641c-.289-.145-.651-.145-.868 0l-28.861 16.641c-.289.144-.434.506-.434.796v33.354c0 .289.145.651.434.796l7.884 4.558c4.268 2.17 6.944-.362 6.944-2.894v-32.92c0-.434.362-.869.868-.869h3.689a.88.88 0 0 1 .868.869v32.92c0 5.715-3.11 9.044-8.535 9.044-1.664 0-2.966 0-6.654-1.809l-7.595-4.341a6.107 6.107 0 0 1-3.038-5.282V140a6.107 6.107 0 0 1 3.038-5.282l28.86-16.713c1.809-1.013 4.268-1.013 6.076 0l28.861 16.713a6.107 6.107 0 0 1 3.038 5.282v33.354a6.107 6.107 0 0 1-3.038 5.282l-28.861 16.713c-.868.362-1.953.651-3.038.651Z" fill="#fff"/><path d="M167.088 173.065c-12.658 0-15.262-5.789-15.262-10.708 0-.435.362-.869.868-.869h3.761c.434 0 .796.29.796.724.579 3.834 2.242 5.716 9.91 5.716 6.076 0 8.68-1.375 8.68-4.631 0-1.881-.724-3.256-10.199-4.196-7.885-.796-12.803-2.533-12.803-8.827 0-5.861 4.918-9.333 13.164-9.333 9.259 0 13.816 3.183 14.395 10.129 0 .217-.073.434-.217.651-.145.145-.362.289-.579.289h-3.834a.847.847 0 0 1-.795-.651c-.868-3.979-3.111-5.282-9.042-5.282-6.655 0-7.45 2.316-7.45 4.052 0 2.098.94 2.75 9.909 3.907 8.897 1.158 13.093 2.822 13.093 9.044 0 6.367-5.281 9.985-14.395 9.985ZM208.752 138.047c0 3.038-2.532 5.571-5.57 5.571-3.038 0-5.569-2.46-5.569-5.571 0-3.184 2.604-5.572 5.569-5.572 2.966 0 5.57 2.46 5.57 5.572Zm-10.271 0c0 2.604 2.097 4.702 4.629 4.702 2.604 0 4.702-2.17 4.702-4.702 0-2.605-2.098-4.631-4.702-4.631-2.459 0-4.629 2.026-4.629 4.631Zm2.604-3.112h2.17c.723 0 2.17 0 2.17 1.664 0 1.158-.724 1.375-1.158 1.52.868.072.941.651 1.013 1.447.072.506.145 1.375.289 1.664h-1.302c0-.289-.217-1.881-.217-1.954-.072-.361-.217-.506-.651-.506h-1.085v2.532h-1.229v-6.367Zm1.157 2.75h.94c.796 0 .941-.579.941-.868 0-.869-.579-.869-.941-.869h-1.012v1.737h.072Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M68.644 65.55a3.681 3.681 0 0 0-1.88-3.183L36.165 44.64c-.506-.29-1.085-.434-1.663-.507h-.29c-.578 0-1.157.217-1.663.507L1.88 62.295A3.71 3.71 0 0 0 0 65.55l.072 47.463c0 .651.362 1.302.94 1.592.58.361 1.303.361 1.809 0l18.228-10.419a3.68 3.68 0 0 0 1.88-3.183V78.791c0-1.303.724-2.533 1.881-3.184l7.74-4.486c.578-.361 1.23-.506 1.88-.506.651 0 1.302.145 1.809.506l7.74 4.486a3.681 3.681 0 0 1 1.88 3.184v22.212a3.68 3.68 0 0 0 1.88 3.183l18.084 10.419a1.768 1.768 0 0 0 1.88 0c.58-.29.94-.941.94-1.592V65.55ZM216.058.217c-.579-.29-1.302-.29-1.809 0-.578.362-.94.94-.94 1.592v47.028c0 .434-.217.868-.651 1.158a1.383 1.383 0 0 1-1.302 0l-7.667-4.414a3.727 3.727 0 0 0-3.689 0l-30.669 17.726a3.682 3.682 0 0 0-1.881 3.184v35.38c0 1.302.724 2.532 1.881 3.183L200 122.78a3.723 3.723 0 0 0 3.689 0l30.669-17.726a3.682 3.682 0 0 0 1.881-3.183V13.674a3.711 3.711 0 0 0-1.881-3.255L216.058.217Zm-2.821 90.005c0 .362-.145.651-.434.796l-10.488 6.078c-.29.144-.651.144-.941 0l-10.488-6.078c-.289-.145-.434-.506-.434-.796V78.067c0-.362.145-.651.434-.796l10.488-6.077c.29-.145.651-.145.941 0l10.488 6.077c.289.145.434.507.434.796v12.155ZM318.119 77.778c1.158-.651 1.809-1.881 1.809-3.184v-8.61a3.77 3.77 0 0 0-1.809-3.183l-30.452-17.654a3.727 3.727 0 0 0-3.689 0l-30.669 17.726a3.681 3.681 0 0 0-1.88 3.184v35.38a3.68 3.68 0 0 0 1.88 3.183l30.452 17.365c1.158.651 2.532.651 3.617 0l18.445-10.274c.579-.29.94-.941.94-1.592 0-.651-.361-1.302-.94-1.592l-30.814-17.726c-.578-.362-.94-.94-.94-1.592V78.14c0-.65.362-1.302.94-1.591l9.62-5.499a1.766 1.766 0 0 1 1.881 0l9.62 5.499c.579.362.941.94.941 1.591v8.683c0 .65.361 1.302.94 1.591a1.766 1.766 0 0 0 1.881 0l18.227-10.635Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M285.353 76.114a.656.656 0 0 1 .723 0l5.859 3.4a.76.76 0 0 1 .362.651v6.801a.76.76 0 0 1-.362.652l-5.859 3.4a.656.656 0 0 1-.723 0l-5.859-3.4a.76.76 0 0 1-.362-.652v-6.8a.76.76 0 0 1 .362-.652l5.859-3.4Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M116.023 45.51a3.727 3.727 0 0 1 3.689 0l30.379 17.58c1.158.652 1.809 1.882 1.809 3.184v35.018a3.77 3.77 0 0 1-1.809 3.184l-30.379 17.581a3.728 3.728 0 0 1-3.689 0l-30.38-17.581c-1.157-.651-1.808-1.881-1.808-3.184v-35.09a3.77 3.77 0 0 1 1.808-3.183l30.38-17.51Z" fill="url(#paint0_linear_337_7903)"/><path opacity=".66" d="m149.946 63.018-30.235-17.581a5.042 5.042 0 0 0-.94-.362l-34.214 58.532c.29.362.651.651 1.013.868l30.452 17.582c.94.506 1.953.651 2.893.289l31.971-58.532a2.611 2.611 0 0 0-.94-.796Z" fill="#4B4B4B"/><path d="m119.638 122.057 30.308-17.582c1.157-.651 1.663-1.881 1.663-3.183v-.145L118.77 45.075c-.94-.29-1.953-.145-2.821.362L85.859 62.8l32.694 59.618c.434-.073.796-.145 1.085-.362Z" fill="url(#paint1_linear_337_7903)"/></g></g><defs><linearGradient id="paint0_linear_337_7903" x1="83.828" y1="83.773" x2="151.968" y2="83.773" gradientUnits="userSpaceOnUse"><stop offset=".005" stop-color="#fff"/><stop offset=".194" stop-color="#E8E8E8"/><stop offset=".542" stop-color="#C2C2C2"/><stop offset=".824" stop-color="#ABABAB"/><stop offset="1" stop-color="#A3A3A3"/></linearGradient><linearGradient id="paint1_linear_337_7903" x1="83.356" y1="83.723" x2="153.647" y2="83.723" gradientUnits="userSpaceOnUse"><stop stop-color="#A3A3A3"/><stop offset=".176" stop-color="#ABABAB"/><stop offset=".458" stop-color="#C2C2C2"/><stop offset=".806" stop-color="#E8E8E8"/><stop offset=".995" stop-color="#fff"/></linearGradient><clipPath id="clip0_337_7903"><path fill="#fff" d="M0 0h320v196H0z"/></clipPath></defs></svg>

site.json

···
   ],
   "socialLinks": [
     {
-      "icon": "/static/images/logos/social-github.svg",
+      "icon": "github",
       "link": "https://github.com/nodejs/node",
-      "kind": "dark",
       "alt": "GitHub"
     },
     {
-      "icon": "/static/images/logos/social-github-dark.svg",
-      "link": "https://github.com/nodejs/node",
-      "kind": "light",
-      "alt": "GitHub"
-    },
-    {
-      "icon": "/static/images/logos/social-mastodon.svg",
+      "icon": "mastodon",
       "link": "https://social.lfx.dev/@nodejs",
-      "kind": "neutral",
       "alt": "Mastodon"
     },
     {
-      "icon": "/static/images/logos/social-twitter.svg",
+      "icon": "twitter",
       "link": "https://twitter.com/nodejs",
-      "kind": "neutral",
       "alt": "Twitter"
     },
     {
-      "icon": "/static/images/logos/social-slack.svg",
+      "icon": "slack",
       "link": "https://openjs-foundation.slack.com/join/shared_invite/zt-238w9sb83-Qk9NcsrEMomq94Y~3gW8EQ#/shared-invite/email",
-      "kind": "neutral",
       "alt": "Slack"
     },
     {
-      "icon": "/static/images/logos/social-linkedin.svg",
+      "icon": "linkedin",
       "link": "https://www.linkedin.com/company/node-js",
-      "kind": "neutral",
       "alt": "LinkedIn"
     }
   ]

styles/new/base.css

···
-* {
-  @apply subpixel-antialiased;
-}
-
-code {
-  @apply rounded
-    bg-neutral-100
-    px-1
-    font-ibm-plex-mono
-    text-base
-    font-semibold
-    text-neutral-900
-    dark:bg-neutral-900
-    dark:text-white;
-}
-
-a,
-a:link,
-a:visited {
-  @apply text-green-600
-   dark:text-green-400;
-
-  &:hover {
-    @apply text-green-900
-      dark:text-green-300;
-  }
-}
-
-ul {
-  @apply list-disc
-    px-5
-    leading-6
-    text-neutral-900
-    dark:text-white;
-}
-
-ol {
-  @apply list-decimal
-    px-5
-    leading-6
-    text-neutral-900
-    dark:text-white;
-}
-
-table {
-  @apply w-full
-    border-separate
-    border-spacing-0
-    rounded
-    border
-    border-neutral-200
-    text-left
-    text-sm
-    dark:border-neutral-800;
-
-  th,
-  td {
-    @apply border
-      border-r-0
-      border-t-0
-      border-neutral-200
-      px-4
-      py-2
-      text-neutral-900
-      dark:border-neutral-800
-      dark:text-white;
-  }
-
-  th {
-    @apply font-semibold;
-  }
-
-  tr:last-child td {
-    @apply border-b-0;
-  }
-
-  td:first-child,
-  th:first-child {
-    @apply border-l-0;
-  }
-}

styles/new/index.css

···
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
-@import './typography';
 @import './mixins';
-@import './base';
+@import './markdown.css';
+
+* {
+  @apply subpixel-antialiased;
+}

styles/new/markdown.css

···
+.mdxContent {
+  h1 {
+    @apply text-4xl;
+  }
+
+  h2 {
+    @apply text-3xl;
+  }
+
+  h3 {
+    @apply text-2xl;
+  }
+
+  h4 {
+    @apply text-xl;
+  }
+
+  h5 {
+    @apply text-lg;
+  }
+
+  h6,
+  strong {
+    @apply text-base;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  strong {
+    @apply font-semibold
+      text-neutral-900
+      dark:text-white;
+  }
+
+  code {
+    @apply rounded
+      bg-neutral-100
+      px-1
+      font-ibm-plex-mono
+      text-base
+      font-semibold
+      text-neutral-900
+      dark:bg-neutral-900
+      dark:text-white;
+  }
+
+  a,
+  a:link,
+  a:visited {
+    @apply text-green-600
+      dark:text-green-400;
+
+    &:hover {
+      @apply text-green-900
+        dark:text-green-300;
+    }
+  }
+
+  ul {
+    @apply list-disc
+      px-5
+      leading-6
+      text-neutral-900
+      dark:text-white;
+  }
+
+  ol {
+    @apply list-decimal
+      px-5
+      leading-6
+      text-neutral-900
+      dark:text-white;
+  }
+
+  table {
+    @apply w-full
+      border-separate
+      border-spacing-0
+      rounded
+      border
+      border-neutral-200
+      text-left
+      text-sm
+      dark:border-neutral-800;
+
+    th,
+    td {
+      @apply border
+        border-r-0
+        border-t-0
+        border-neutral-200
+        px-4
+        py-2
+        text-neutral-900
+        dark:border-neutral-800
+        dark:text-white;
+    }
+
+    th {
+      @apply font-semibold;
+    }
+
+    tr:last-child td {
+      @apply border-b-0;
+    }
+
+    td:first-child,
+    th:first-child {
+      @apply border-l-0;
+    }
+  }
+}

styles/new/typography.css

···
-h1 {
-  @apply text-4xl;
-}
-
-h2 {
-  @apply text-3xl;
-}
-
-h3 {
-  @apply text-2xl;
-}
-
-h4 {
-  @apply text-xl;
-}
-
-h5 {
-  @apply text-lg;
-}
-
-h6 {
-  @apply text-base;
-}
-
-strong {
-  @apply text-base;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-strong {
-  @apply font-semibold;
-}

tailwind.config.ts

···
         900: '#411526',
       },
       white: '#FFFFFF',
+      'white-opaque': 'rgba(255, 255, 255, 0.5)',
       transparent: 'transparent',
     },
     fontSize: {

types/config.ts

···
 export interface SocialConfig {
   icon: string;
   link: string;
-  kind: 'dark' | 'light' | 'neutral';
   alt?: string;
 }