-
Notifications
You must be signed in to change notification settings - Fork 1
/
about.html
5 lines (5 loc) · 34.7 KB
/
about.html
1
2
3
4
5
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/16d983cf168ba446-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/364091edb3b3d89a-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/3fb144034c194814-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/48447be3ff22dbe5-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/4dd1ca8167407b73-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/682dafca9fbeb220-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/a24f32beb6e7a786-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/c5c10b6c79e7c8d3-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/ce05ea4eccaa7865-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/dce4e2eda8daaefa-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/e0fa7b65f7804beb.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/01869217fba2a643.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/3eabd8cac0b8578d.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/5e63ce5d1c715655.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/7bcd234d65739332.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/b96b20ee6eaeb372.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/101a228fb3455223.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/a9d83cc4194f86cd.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/9da5797e5fcf502a.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/4c1888751b86a8d9.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-34f7adf47207d9ac.js"/><script src="/_next/static/chunks/1dd3208c-94024c28abbb6bbd.js" async=""></script><script src="/_next/static/chunks/286-e039e3ba24258f38.js" async=""></script><script src="/_next/static/chunks/main-app-c5c93ffd567aae6e.js" async=""></script><script src="/_next/static/chunks/5469-0184e94f7de55262.js" async=""></script><script src="/_next/static/chunks/5658-582c5908005b057f.js" async=""></script><script src="/_next/static/chunks/app/about/page-688d1bf4f17f58e0.js" async=""></script><script src="/_next/static/chunks/8287-e5b3491cbf25ed33.js" async=""></script><script src="/_next/static/chunks/6479-ef8ecd7df819adb8.js" async=""></script><script src="/_next/static/chunks/app/layout-85bbd3021cad7dbf.js" async=""></script><script src="/_next/static/chunks/app/page-3a51cf8181636895.js" async=""></script><script src="/_next/static/chunks/app/not-found-283f76a8505881fe.js" async=""></script><link rel="preload" href="/core-out/index.bundle.js" as="script"/><link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%0A%20%20%20%20%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23000%22%20width%3D%2280%22%20height%3D%2260%22%20viewBox%3D%220%200%2080%2060%22%3E%0A%20%20%20%20%20%20%3Crect%20width%3D%2280%22%20height%3D%2260%22%20fill%3D%22%23fff%22%20rx%3D%228%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20fill%3D%22%23000%22%20d%3D%22m26.87%2024.123-2.95%202.197c-1.387-1.2-3.187-1.43-4.178-1.43-.997%200-2.046.288-2.205%201.004-.159.694.492%201.236%201.605%201.54%201.272.34%202.422.643%204.207%201.15%202.646.758%204.46%201.9%204.46%204.553%200%203.665-3.252%205.56-7.604%205.56s-7.316-2.264-8.205-3.32l3.116-2.327c2.19%201.908%203.708%202.176%204.98%202.176%201.46%200%202.827-.311%203-1.135.145-.665-.404-1.193-1.648-1.482-1.402-.326-2.595-.586-3.918-.933-3.593-.939-4.605-3.028-4.605-4.906%200-2.581%202.4-5.234%206.803-5.234%204.503%200%207.142%202.579%207.142%202.587Zm18.788-2.328H32.516v16.417h13.38v-3.788h-8.768v-2.646h6.036v-3.621h-6.036V25.54h8.523v-3.745h.007ZM29.118%2042h1.02V18h-1.02v24Zm18.506%200h1.02V18h-1.02v24Zm3.398-3.788h10.554c2.82%200%205.11-1.699%205.11-4.424%200-2.125-1.387-3.535-3.339-4.157a.837.837%200%200%200-.188-.021c.065-.008.13-.015.188-.037%201.12-.44%202.35-1.619%202.35-3.621%200-2.545-2.249-4.164-5.025-4.164h-9.657l.007%2016.424Zm4.633-13.005h3.687c.846%200%201.533.673%201.533%201.439s-.687%201.446-1.533%201.446h-3.687v-2.885Zm4.504%209.362h-4.51v-2.993h4.51c.795%200%201.446.643%201.446%201.496%200%20.846-.644%201.497-1.446%201.497Z%22%2F%3E%0A%20%20%20%20%3C%2Fsvg%3E%0A%20%20"/><title>About — Green </title><meta name="description" content="Green Design System"/><link rel="canonical" href="https://seb.io/about/about"/><meta property="og:title" content="About — Green "/><meta property="og:description" content="Green Design System"/><meta property="og:image" content="https://seb.io/about/og?title=About"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="About — Green "/><meta name="twitter:description" content="Green Design System"/><meta name="twitter:image" content="https://seb.io/about/og?title=About"/><meta name="next-size-adjust"/><script src="/_next/static/chunks/polyfills-78c92fac7aa8fdd8.js" noModule=""></script></head><body><script>!function(){try{var d=document.documentElement,n='theme',s='setAttribute';var e=localStorage.getItem('theme');if('system'===e||(!e&&true)){var t='(prefers-color-scheme: dark)',m=window.matchMedia(t);if(m.media!==t||m.matches){d[s](n,'dark')}else{d[s](n,'light')}}else if(e){d[s](n,e|| '')}}catch(e){}}()</script><main class="layout-main"><div class="alert"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg><span>This is the staging site of seb.io, The Green Design System is work in progress and not ready to use, but feel free to explore!</span></div><header class="main"><nav><button class="hamburger "><svg viewBox="0 0 24 24"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg>Menu</button></nav><a class="logo" aria-label="SEB" href="/"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 55 24"><path fill="currentColor" d="M14.87 6.123 11.92 8.32c-1.387-1.2-3.187-1.43-4.178-1.43-.997 0-2.046.288-2.205 1.004-.159.694.492 1.236 1.605 1.54 1.272.34 2.422.643 4.207 1.15 2.646.758 4.46 1.9 4.46 4.553 0 3.665-3.252 5.56-7.604 5.56S.889 18.433 0 17.377l3.116-2.327c2.19 1.908 3.708 2.176 4.98 2.176 1.46 0 2.827-.311 3-1.135.145-.665-.404-1.193-1.648-1.482-1.402-.326-2.595-.586-3.918-.933C1.937 12.737.925 10.648.925 8.77c0-2.581 2.4-5.234 6.803-5.234 4.503 0 7.142 2.58 7.142 2.588Zm18.788-2.328H20.516v16.417h13.38v-3.788h-8.768v-2.646h6.036v-3.621h-6.036V7.54h8.523V3.795h.007ZM17.118 24h1.02V0h-1.02v24Zm18.506 0h1.02V0h-1.02v24Zm3.398-3.788h10.554c2.82 0 5.11-1.699 5.11-4.424 0-2.125-1.387-3.535-3.339-4.157a.837.837 0 0 0-.188-.021c.065-.008.13-.015.188-.037 1.12-.44 2.35-1.619 2.35-3.621 0-2.545-2.249-4.164-5.025-4.164h-9.657l.007 16.424Zm4.633-13.005h3.687c.846 0 1.533.673 1.533 1.439s-.687 1.446-1.533 1.446h-3.687V7.207Zm4.504 9.362h-4.51v-2.993h4.51c.795 0 1.446.643 1.446 1.496 0 .846-.644 1.497-1.446 1.497Z"></path></svg></a><nav><button class="shortcut"><svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg><span>⌘K</span></button><a class="github" target="_blank" aria-label="GitHub" href="https://github.com/seb-oss/green"><svg viewBox="0 0 24 24"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg></a><button class="theme" aria-label="Toggle Light Theme"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></button></nav></header><section class="layout-article"><section class="layout-content page-content"><gds-grid gap-inline="large" padding-block="large" padding-inline="large" columns="2" align="start"><gds-grid gap-block="large" columns="1"><div class="hero"><h1 class="gds-fs-display-large">About</h1><p class="gds-fs-headline-large color-secondary">Green Design System is the design system for Skandinaviska Enskilda Banken to make it easier and faster to build beautiful digital products and experiences under the SEB brand.</p></div><gds-grid columns="2"><h2 id="what-is-green" class="heading-medium">What is Green?</h2><div><p class="paragraph-medium text-secondary">Green Design System is a set of standards to manage design at scale by reducing redundancy while creating a shared language and visual consistency across different pages and channels.</p><p class="paragraph-medium text-secondary">In order to have velocity when building digital products and keep a cohesive user experience cross channels and platforms designers and developers should use the Green Design System.</p><p class="paragraph-medium text-secondary">By using pre-built components for design tools and front-end frameworks the time teams spend designing and building is minimized. Instead of spending time on building and re-building the same components in multiple teams, teams can spend that time on addressing specific user needs to improve user experience.</p><p class="paragraph-medium text-secondary">The design system is called Green as an homage to SEB being viewed as the <!-- -->green bank<!-- --> with green as a primary colour for the brand and the bank. The bank also plays a great role in the transition to a<a target="_blank" href="https://sebgroup.com/sustainability/netzerotransition">net zero society</a>and has a focus on<a href="https://sebgroup.com/sustainability">sustainability</a>and helping<!-- -->it's<!-- --> clients to become more sustainable. The design system initative was also seen as a<a target="_blank" href="https://en.wikipedia.org/wiki/Greenfield_project">Greenfieldproject</a>.</p></div></gds-grid><img alt="A picture of a cabin in the woods" loading="lazy" width="2000" height="1497" decoding="async" data-nimg="1" style="color:transparent;width:100%;height:auto;object-fit:cover;object-position:center;aspect-ratio:16 / 9" src="/_next/static/media/woods-cabin.cc21df67.png"/><gds-grid columns="2"><h2 id="how-green-works" class="heading-medium">How Green works</h2><p class="paragraph-medium text-secondary">The Green Design System is a federated design system where the Green Design System Team is the central team who is dedicated to maintain the design system and other team at SEB or external contributors contribute to the design system with insights, design andcode.</p></gds-grid><gds-grid columns="2"><h2 id="maintaining-and-educating" class="heading-medium">Maintaining and educating</h2><div><p class="paragraph-medium text-secondary">Navigating the world of Green Design System involves more than just design and code. Delve into our Figma libraries, explore diverse code implementations, and leverage our comprehensive documentation. <!-- -->We're<!-- --> committed to supporting your journey with coaching sessions tailored for both design intricacies and development challenges.</p><div class="gds-spacing gds-spacing--vertical gds-spacing--vertical--8"></div><div class="gds-accordion"><div class="gds-accordion-item"><div role="heading" aria-level="3"><button id="gds-accordion-item-button--c7b049dc-603c-4517-a513-117658622e67" aria-expanded="false" aria-controls="gds-accordion-item-region--c7b049dc-603c-4517-a513-117658622e67"><span>Figma libraries</span><div class="gds-accordion-item__icon-button"><svg viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg></div></button></div><div role="region" id="gds-accordion-item-region--c7b049dc-603c-4517-a513-117658622e67" aria-labelledby="gds-accordion-item-button--c7b049dc-603c-4517-a513-117658622e67" hidden=""><div><p>Figma is our go to design tool and we maintain multiple Figma libraries, components and variables.</p></div></div></div><div class="gds-accordion-item"><div role="heading" aria-level="3"><button id="gds-accordion-item-button--e3795f16-d6f0-4d7e-93dc-690ec9ab64ca" aria-expanded="false" aria-controls="gds-accordion-item-region--e3795f16-d6f0-4d7e-93dc-690ec9ab64ca"><span>Multiple code implementations</span><div class="gds-accordion-item__icon-button"><svg viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg></div></button></div><div role="region" id="gds-accordion-item-region--e3795f16-d6f0-4d7e-93dc-690ec9ab64ca" aria-labelledby="gds-accordion-item-button--e3795f16-d6f0-4d7e-93dc-690ec9ab64ca" hidden=""><div><p>Green supports both Angular and React but the core is built with Webcomponents using Lit.</p></div></div></div><div class="gds-accordion-item"><div role="heading" aria-level="3"><button id="gds-accordion-item-button--0adf067e-665c-4fa3-bd2d-7c7fd1a4befc" aria-expanded="false" aria-controls="gds-accordion-item-region--0adf067e-665c-4fa3-bd2d-7c7fd1a4befc"><span>Documenting design and code patters</span><div class="gds-accordion-item__icon-button"><svg viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg></div></button></div><div role="region" id="gds-accordion-item-region--0adf067e-665c-4fa3-bd2d-7c7fd1a4befc" aria-labelledby="gds-accordion-item-button--0adf067e-665c-4fa3-bd2d-7c7fd1a4befc" hidden=""><div><p>We use this site to document how to use our design kits and coded components as well as our design patterns and general user interface guidelines.</p></div></div></div><div class="gds-accordion-item"><div role="heading" aria-level="3"><button id="gds-accordion-item-button--7a24ae6e-0e3f-4aae-a23b-598859d0f287" aria-expanded="false" aria-controls="gds-accordion-item-region--7a24ae6e-0e3f-4aae-a23b-598859d0f287"><span>Supporting our users</span><div class="gds-accordion-item__icon-button"><svg viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg></div></button></div><div role="region" id="gds-accordion-item-region--7a24ae6e-0e3f-4aae-a23b-598859d0f287" aria-labelledby="gds-accordion-item-button--7a24ae6e-0e3f-4aae-a23b-598859d0f287" hidden=""><div><p>We know that learing and using a new system can be hard and we are here to help and make your journey in the design system a more pleasant one.</p></div></div></div><div class="gds-accordion-item"><div role="heading" aria-level="3"><button id="gds-accordion-item-button--5b1709e2-fff3-4231-afda-5aec67622408" aria-expanded="false" aria-controls="gds-accordion-item-region--5b1709e2-fff3-4231-afda-5aec67622408"><span>Coaching Green users</span><div class="gds-accordion-item__icon-button"><svg viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg></div></button></div><div role="region" id="gds-accordion-item-region--5b1709e2-fff3-4231-afda-5aec67622408" aria-labelledby="gds-accordion-item-button--5b1709e2-fff3-4231-afda-5aec67622408" hidden=""><div><p>Some problems that you run into can be too large to use your keyboard to explain so we have ongoing coaching sessions at your disposal. We have two different coaching session regarding design and development at SEB: Green Coaching and CX Coaching. Both of these meetings are slot based meeting where you bring your questions and problems and discuss them with members from the Green Design System team.</p><div class="gds-spacing gds-spacing--vertical gds-spacing--vertical--7"></div><ul><li>– Book<a href="https://teams.microsoft.com/l/entity/0d820ecd-def2-4297-adad-78056cde7c78/_djb2_msteams_prefix_4065088102?context=%7B%22channelId%22%3A%2219%3A33f450cae2764531930c4eca19aa4c26%40thread.tacv2%22%7D&groupId=3ad3eb8f-ab23-44e6-9b61-d08fee172513&tenantId=9a8ff9e3-0e35-4620-a724-e9834dc50b51" target="_blank">Green Coaching</a></li><li>–Book<a href="https://teams.microsoft.com/l/entity/0d820ecd-def2-4297-adad-78056cde7c78/_djb2_msteams_prefix_43486807?context=%7B%22channelId%22%3A%2219%3A33f450cae2764531930c4eca19aa4c26%40thread.tacv2%22%7D&groupId=3ad3eb8f-ab23-44e6-9b61-d08fee172513&tenantId=9a8ff9e3-0e35-4620-a724-e9834dc50b51" target="_blank">CX Coaching</a></li></ul></div></div></div></div></div></gds-grid><gds-grid columns="2"><h2 id="built-on-contributions" class="heading-medium">Built on contributions</h2><p class="paragraph-medium text-secondary">Green Design System is built on contributions from
everyone. Product teams at SEB have the best knowledge what their product's end user needs. That's why it's vital that everyone contributes with what's
possible. That can be everything from insights regarding a specific component or pull requests with a complete feature
or a design updates in a Figma branch.</p></gds-grid><gds-grid columns="2"><h2 id="contact-us" class="heading-medium">Contact us</h2><div><p class="paragraph-medium text-secondary">We want to hear from you so don't be a stranger. You can
always reach out to us in the following ways:</p><ul class="paragraph-medium text-secondary"><li>— Ask in our<a target="_blank" href="https://teams.microsoft.com/l/team/19%3aR-yrtyItfX3RWEyU8WrCyVy6u-eqWxYPbY1w2O7UVPs1%40thread.tacv2/conversations?groupId=3ad3eb8f-ab23-44e6-9b61-d08fee172513&tenantId=9a8ff9e3-0e35-4620-a724-e9834dc50b51">Teams channel</a></li><li>— Post an<a href="https://github.com/seb-oss/green/issues">issue on Github</a></li><li>— Email us at<a href="mailto:[email protected]">[email protected]</a></li></ul></div></gds-grid></gds-grid><div class="toc-sidebar"><aside class="toc"><span>On this page</span><nav data-name="On this page"><a data-id="top" data-level="1" href="#top">About</a><a class="toc-link " data-id="what-is-green" data-level="2" href="#what-is-green">What is Green?</a><details><summary><a class="toc-link " data-id="how-green-works" data-level="2" href="#how-green-works">How Green works</a><div class="disclosure" aria-label="Expand" tabindex="0"><svg viewBox="0 0 24 24"><polyline points="6 9 12 15 18 9"></polyline></svg></div></summary><a class="toc-link " data-id="maintaining-and-educating" data-level="3" href="#maintaining-and-educating">Maintaining and educating</a><a class="toc-link " data-id="built-on-contributions" data-level="3" href="#built-on-contributions">Built on contributions</a></details><a class="toc-link " data-id="contact-us" data-level="2" href="#contact-us">Contact us</a></nav></aside></div></gds-grid></section></section><footer class="main-footer" padding-block="large"><gds-grid gap-block="large" padding-inline="medium" columns="1" mobile="2" tablet="3"><h2>Green Design System</h2><gds-grid columns="5" fluid="true"><nav><ul><gds-grid gap-block="small" columns="1"><li><a href="/about">About</a></li><li><a href="/foundation">Foundation</a></li><li><a href="/components">Components</a></li></gds-grid></ul></nav><nav><ul><gds-grid gap-block="small" columns="1"><li><a href="https://github.com/seb-oss/green">Github</a></li><li><a href="/changelog">Changelog</a></li><li><a href="/status">Status</a></li></gds-grid></ul></nav><nav><ul><gds-grid gap-block="small" columns="1"><li><a href="https://sebgroup.com/">SEB Group</a></li><li><a href="https://seb.se/">SEB.se</a></li></gds-grid></ul></nav></gds-grid><div class="gds-flex gds-flex-wrap-wrap"><span>© 2024 Green Design System</span><button type="button" data-cc="c-settings" class="cookie-preferences">Cookie preferences</button></div></gds-grid></footer></main><div class="cmd " role="dialog"><main><form><label for="search"><svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg></label><input id="search" type="text" placeholder="⌘K — Search components & pages"/><button type="reset"><svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></button></form><section><div><div class="category" tabindex="-1">Changelog</div><div class="list"><a class="" href="/changelog/1.0.0-beta.1"><div class="cmdk-item-name"><span class="cmdk-item-char">v</span><span>1.0.0-beta.1</span></div></a></div></div><div><div class="category" tabindex="-1">Component</div><div class="list"><a class="" href="/component/breadcrumb"><div class="cmdk-item-name"><span class="cmdk-item-char">B</span><span>Breadcrumb</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a><a class="" href="/component/button"><div class="cmdk-item-name"><span class="cmdk-item-char">B</span><span>Button</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a><a class="" href="/component/checkbox"><div class="cmdk-item-name"><span class="cmdk-item-char">C</span><span>Checkbox</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a><a class="" href="/component/form"><div class="cmdk-item-name"><span class="cmdk-item-char">F</span><span>Form</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a><a class="" href="/component/input"><div class="cmdk-item-name"><span class="cmdk-item-char">I</span><span>Input</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a><a class="" href="/component/radiobutton"><div class="cmdk-item-name"><span class="cmdk-item-char">R</span><span>Radiobutton</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a><a class="" href="/component/segmentedcontrol"><div class="cmdk-item-name"><span class="cmdk-item-char">S</span><span>Segmented control</span></div><div class="cmdk-options"><span><svg viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"></path><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"></path><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"></path><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"></path><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"></path></svg></span><span><svg viewBox="0 0 24 24"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></span></div></a></div></div></section><footer><svg width="14" height="14" viewBox="0 0 25 25"><path d="M24.1819 7.19041C19.6399 7.19041 15.6799 9.77498 13.6419 13.5785C13.2849 11.1715 12.3789 8.88337 10.9969 6.89791C9.20875 4.31037 6.69322 2.3358 3.78189 1.23449L3.15489 0.998047L2.80189 1.57692C1.72967 3.3372 1.11407 5.34635 1.01291 7.41566C0.911744 9.48497 1.32833 11.5465 2.22355 13.4067C3.11876 15.2669 4.46323 16.8646 6.13066 18.0499C7.79809 19.2352 9.73377 19.969 11.7559 20.1826C11.3979 21.9752 10.8799 24.412 10.8799 24.412C10.8623 24.4813 10.8606 24.5537 10.8747 24.6237C10.8889 24.6938 10.9186 24.7596 10.9615 24.8162C11.0044 24.8727 11.0595 24.9185 11.1225 24.95C11.1855 24.9816 11.2547 24.998 11.3249 24.998H12.7829C12.8914 24.9982 12.9964 24.9591 13.0793 24.8879C13.1622 24.8166 13.2177 24.7177 13.2359 24.6087C13.2359 24.6087 13.4399 21.7816 13.5609 20.2396C19.9179 19.94 24.9999 14.5752 24.9999 8.02408V7.18939L24.1819 7.19041ZM2.63589 8.02408C2.63488 6.29308 3.05217 4.58847 3.85089 3.06081C8.86089 5.25912 12.1809 10.3539 12.1809 15.9541C12.1809 16.8183 12.1039 17.6805 11.9499 18.5305C9.39638 18.2657 7.03015 17.0446 5.30946 15.1036C3.58877 13.1626 2.63608 10.6399 2.63589 8.02408ZM13.8519 18.5519C14.2649 13.4184 18.2919 9.3133 23.3279 8.89443C22.9179 14.0259 18.8889 18.131 13.8519 18.5519Z" fill="currentColor"></path></svg><div class="cmd-options"><div>Select<kbd><svg viewBox="0 0 24 24"><polyline points="9 10 4 15 9 20"></polyline><path d="M20 4v7a4 4 0 0 1-4 4H4"></path></svg></kbd></div><div>Escape<kbd>⎋</kbd></div></div></footer></main></div><script src="/_next/static/chunks/webpack-34f7adf47207d9ac.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script>self.__next_f.push([1,"1:HL[\"/_next/static/media/16d983cf168ba446-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n2:HL[\"/_next/static/media/364091edb3b3d89a-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n3:HL[\"/_next/static/media/3fb144034c194814-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n4:HL[\"/_next/static/media/48447be3ff22dbe5-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n5:HL[\"/_next/static/media/4dd1ca8167407b73-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n6:HL[\"/_next/static/media/682dafca9fbeb220-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n7:HL[\"/_next/static/media/a24f32beb6e7a786-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n8:HL[\"/_next/static/media/c5c10b6c79e7c8d3-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n9:HL[\"/_next/static/media/ce05ea4eccaa7865-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\na:HL[\"/_next/static/media/dce4e2eda8daaefa-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\nb:HL[\"/_next/static/css/e0fa7b65f7804beb.css\",\"style\"]\nc:HL[\"/_next/static/css/01869217fba2a643.css\",\"style\"]\nd:HL[\"/_next/static/css/3eabd8cac0b8578d.css\",\"style\"]\ne:HL[\"/_next/static/css/5e63ce5d1c715655.css\",\"style\"]\nf:HL[\"/_next/static/css/7bcd234d65739332.css\",\"style\"]\n10:HL[\"/_next/static/css/b96b20ee6eaeb372.css\",\"style\"]\n11:HL[\"/_next/static/css/101a228fb3455223.css\",\"style\"]\n12:HL[\"/_next/static/css/a9d83cc4194f86cd.css\",\"style\"]\n13:HL[\"/_next/static/css/9da5797e5fcf502a.css\",\"style\"]\n14:HL[\"/_next/static/css/4c1888751b86a8d9.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"15:I[9562,[],\"\"]\n17:I[5685,[],\"ClientPageRoot\"]\n18:I[7976,[\"5469\",\"static/chunks/5469-0184e94f7de55262.js\",\"5658\",\"static/chunks/5658-582c5908005b057f.js\",\"7301\",\"static/chunks/app/about/page-688d1bf4f17f58e0.js\"],\"default\",1]\n19:I[8703,[],\"\"]\n1a:I[3751,[],\"\"]\n1b:I[7702,[\"5469\",\"static/chunks/5469-0184e94f7de55262.js\",\"5658\",\"static/chunks/5658-582c5908005b057f.js\",\"8287\",\"static/chunks/8287-e5b3491cbf25ed33.js\",\"6479\",\"static/chunks/6479-ef8ecd7df819adb8.js\",\"3185\",\"static/chunks/app/layout-85bbd3021cad7dbf.js\"],\"default\",1]\n1c:I[2282,[\"5469\",\"static/chunks/5469-0184e94f7de55262.js\",\"6479\",\"static/chunks/6479-ef8ecd7df819adb8.js\",\"1931\",\"static/chunks/app/page-3a51cf8181636895.js\"],\"default\"]\n1d:I[316,[\"5469\",\"static/chunks/5469-0184e94f7de55262.js\",\"6479\",\"static/chunks/6479-ef8ecd7df819adb8.js\",\"1931\",\"static/chunks/app/page-3a51cf8181636895.js\"],\"default\"]\n1e:I[5469,[\"5469\",\"static/chunks/5469-0184e94f7de55262.js\",\"9160\",\"static/chunks/app/not-found-283f76a8505881fe.js\"],\"\"]\n21:I[1395,[],\"\"]\n1f:{}\n22:[]\n"])</script><script>self.__next_f.push([1,"0:[\"$\",\"$L15\",null,{\"buildId\":\"13m1X9IEda3jW6uYKOuWj\",\"assetPrefix\":\"\",\"urlParts\":[\"\",\"about\"],\"initialTree\":[\"\",{\"children\":[\"about\",{\"children\":[\"__PAGE__\",{}]}]},\"$undefined\",\"$undefined\",true],\"initialSeedData\":[\"\",{\"children\":[\"about\",{\"children\":[\"__PAGE__\",{},[[\"$L16\",[\"$\",\"$L17\",null,{\"props\":{\"params\":{},\"searchParams\":{}},\"Component\":\"$18\"}],[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/7bcd234d65739332.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/b96b20ee6eaeb372.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/101a228fb3455223.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/a9d83cc4194f86cd.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"4\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/9da5797e5fcf502a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"5\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/4c1888751b86a8d9.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]]],null],null]},[[null,[\"$\",\"$L19\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"about\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L1a\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]],null],null]},[[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/e0fa7b65f7804beb.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/01869217fba2a643.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/3eabd8cac0b8578d.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/5e63ce5d1c715655.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]],[\"$\",\"$L1b\",null,{\"children\":[\"$\",\"$L19\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L1a\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[\"$\",\"$L1c\",null,{\"layout\":\"home\",\"children\":[\"$\",\"$L1d\",null,{\"columns\":1,\"gapBlock\":\"large\",\"paddingInline\":\"large\",\"paddingBlock\":\"large\",\"children\":[[\"$\",\"h1\",null,{\"className\":\"heading-medium\",\"children\":\"404 - Page Not Found\"}],[\"$\",\"$L1e\",null,{\"href\":\"/\",\"children\":\"Go back\"}]]}]}],\"notFoundStyles\":[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/4c1888751b86a8d9.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\"}]]}],\"params\":\"$1f\"}]],null],null],\"couldBeIntercepted\":false,\"initialHead\":[null,\"$L20\"],\"globalErrorComponent\":\"$21\",\"missingSlots\":\"$W22\"}]\n"])</script><script>self.__next_f.push([1,"20:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"1\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"2\",{\"children\":\"About — Green \"}],[\"$\",\"meta\",\"3\",{\"name\":\"description\",\"content\":\"Green Design System\"}],[\"$\",\"link\",\"4\",{\"rel\":\"canonical\",\"href\":\"https://seb.io/about/about\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:title\",\"content\":\"About — Green \"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:description\",\"content\":\"Green Design System\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:image\",\"content\":\"https://seb.io/about/og?title=About\"}],[\"$\",\"meta\",\"8\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"9\",{\"name\":\"twitter:title\",\"content\":\"About — Green \"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:description\",\"content\":\"Green Design System\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:image\",\"content\":\"https://seb.io/about/og?title=About\"}],[\"$\",\"meta\",\"12\",{\"name\":\"next-size-adjust\"}]]\n16:null\n"])</script></body></html>