Brand page

This commit is contained in:
David Hill
2025-10-30 22:13:48 +00:00
parent f18847d739
commit 37baed99c1
23 changed files with 401 additions and 82 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@@ -0,0 +1,16 @@
<svg width="240" height="300" viewBox="0 0 240 300" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1401_86283)">
<mask id="mask0_1401_86283" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="240" height="300">
<path d="M240 0H0V300H240V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_1401_86283)">
<path d="M180 240H60V120H180V240Z" fill="#4B4646"/>
<path d="M180 60H60V240H180V60ZM240 300H0V0H240V300Z" fill="#F1ECEC"/>
</g>
</g>
<defs>
<clipPath id="clip0_1401_86283">
<rect width="240" height="300" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 593 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@@ -0,0 +1,16 @@
<svg width="240" height="300" viewBox="0 0 240 300" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1401_86274)">
<mask id="mask0_1401_86274" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="240" height="300">
<path d="M240 0H0V300H240V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_1401_86274)">
<path d="M180 240H60V120H180V240Z" fill="#CFCECD"/>
<path d="M180 60H60V240H180V60ZM240 300H0V0H240V300Z" fill="#211E1E"/>
</g>
</g>
<defs>
<clipPath id="clip0_1401_86274">
<rect width="240" height="300" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 593 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@@ -0,0 +1,30 @@
<svg width="641" height="115" viewBox="0 0 641 115" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1401_86292)">
<mask id="mask0_1401_86292" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="641" height="115">
<path d="M640.714 0H0V115H640.714V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_1401_86292)">
<path d="M49.2868 82.1433H16.4297V49.2861H49.2868V82.1433Z" fill="#4B4646"/>
<path d="M49.2857 32.8573H16.4286V82.143H49.2857V32.8573ZM65.7143 98.5716H0V16.4287H65.7143V98.5716Z" fill="#B7B1B1"/>
<path d="M131.427 82.1433H98.5703V49.2861H131.427V82.1433Z" fill="#4B4646"/>
<path d="M98.5692 82.143H131.426V32.8573H98.5692V82.143ZM147.855 98.5716H98.5692V115H82.1406V16.4287H147.855V98.5716Z" fill="#B7B1B1"/>
<path d="M229.997 65.7139V82.1424H180.711V65.7139H229.997Z" fill="#4B4646"/>
<path d="M230.003 65.7144H180.718V82.143H230.003V98.5716H164.289V16.4287H230.003V65.7144ZM180.718 49.2859H213.575V32.8573H180.718V49.2859Z" fill="#B7B1B1"/>
<path d="M295.717 98.5718H262.859V49.2861H295.717V98.5718Z" fill="#4B4646"/>
<path d="M295.715 32.8573H262.858V98.5716H246.43V16.4287H295.715V32.8573ZM312.144 98.5716H295.715V32.8573H312.144V98.5716Z" fill="#B7B1B1"/>
<path d="M394.286 82.1433H345V49.2861H394.286V82.1433Z" fill="#4B4646"/>
<path d="M394.285 32.8573H344.999V82.143H394.285V98.5716H328.57V16.4287H394.285V32.8573Z" fill="#F1ECEC"/>
<path d="M459.998 82.1433H427.141V49.2861H459.998V82.1433Z" fill="#4B4646"/>
<path d="M459.997 32.8573H427.14V82.143H459.997V32.8573ZM476.425 98.5716H410.711V16.4287H476.425V98.5716Z" fill="#F1ECEC"/>
<path d="M542.146 82.1433H509.289V49.2861H542.146V82.1433Z" fill="#4B4646"/>
<path d="M542.145 32.8571H509.288V82.1429H542.145V32.8571ZM558.574 98.5714H492.859V16.4286H542.145V0H558.574V98.5714Z" fill="#F1ECEC"/>
<path d="M640.715 65.7139V82.1424H591.43V65.7139H640.715Z" fill="#4B4646"/>
<path d="M591.429 32.8573V49.2859H624.286V32.8573H591.429ZM640.714 65.7144H591.429V82.143H640.714V98.5716H575V16.4287H640.714V65.7144Z" fill="#F1ECEC"/>
</g>
</g>
<defs>
<clipPath id="clip0_1401_86292">
<rect width="640.714" height="115" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@@ -0,0 +1,30 @@
<svg width="640" height="115" viewBox="0 0 640 115" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1401_86330)">
<mask id="mask0_1401_86330" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="640" height="115">
<path d="M640 0H0V115H640V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_1401_86330)">
<path d="M49.2346 82.1433H16.4141V49.2861H49.2346V82.1433Z" fill="#CFCECD"/>
<path d="M49.2308 32.8573H16.4103V82.143H49.2308V32.8573ZM65.641 98.5716H0V16.4287H65.641V98.5716Z" fill="#656363"/>
<path d="M131.281 82.1433H98.4609V49.2861H131.281V82.1433Z" fill="#CFCECD"/>
<path d="M98.4649 82.143H131.285V32.8573H98.4649V82.143ZM147.696 98.5716H98.4649V115H82.0547V16.4287H147.696V98.5716Z" fill="#656363"/>
<path d="M229.746 65.7139V82.1424H180.516V65.7139H229.746Z" fill="#CFCECD"/>
<path d="M229.743 65.7144H180.512V82.143H229.743V98.5716H164.102V16.4287H229.743V65.7144ZM180.512 49.2859H213.332V32.8573H180.512V49.2859Z" fill="#656363"/>
<path d="M295.383 98.5718H262.562V49.2861H295.383V98.5718Z" fill="#CFCECD"/>
<path d="M295.387 32.8573H262.567V98.5716H246.156V16.4287H295.387V32.8573ZM311.797 98.5716H295.387V32.8573H311.797V98.5716Z" fill="#656363"/>
<path d="M393.848 82.1433H344.617V49.2861H393.848V82.1433Z" fill="#CFCECD"/>
<path d="M393.844 32.8573H344.613V82.143H393.844V98.5716H328.203V16.4287H393.844V32.8573Z" fill="#211E1E"/>
<path d="M459.485 82.1433H426.664V49.2861H459.485V82.1433Z" fill="#CFCECD"/>
<path d="M459.489 32.8573H426.668V82.143H459.489V32.8573ZM475.899 98.5716H410.258V16.4287H475.899V98.5716Z" fill="#211E1E"/>
<path d="M541.539 82.1433H508.719V49.2861H541.539V82.1433Z" fill="#CFCECD"/>
<path d="M541.535 32.8571H508.715V82.1428H541.535V32.8571ZM557.946 98.5714H492.305V16.4286H541.535V0H557.946V98.5714Z" fill="#211E1E"/>
<path d="M639.996 65.7139V82.1424H590.766V65.7139H639.996Z" fill="#CFCECD"/>
<path d="M590.77 32.8573V49.2859H623.59V32.8573H590.77ZM640 65.7144H590.77V82.143H640V98.5716H574.359V16.4287H640V65.7144Z" fill="#211E1E"/>
</g>
</g>
<defs>
<clipPath id="clip0_1401_86330">
<rect width="640" height="115" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@@ -0,0 +1,22 @@
<svg width="641" height="115" viewBox="0 0 641 115" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1401_86315)">
<mask id="mask0_1401_86315" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="641" height="115">
<path d="M640.714 0H0V115H640.714V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_1401_86315)">
<path d="M49.2857 32.8573H16.4286V82.143H49.2857V32.8573ZM65.7143 98.5716H0V16.4287H65.7143V98.5716Z" fill="#F1ECEC"/>
<path d="M98.5692 82.143H131.426V32.8573H98.5692V82.143ZM147.855 98.5716H98.5692V115H82.1406V16.4287H147.855V98.5716Z" fill="#F1ECEC"/>
<path d="M230.003 65.7144H180.718V82.143H230.003V98.5716H164.289V16.4287H230.003V65.7144ZM180.718 49.2859H213.575V32.8573H180.718V49.2859Z" fill="#F1ECEC"/>
<path d="M295.715 32.8573H262.858V98.5716H246.43V16.4287H295.715V32.8573ZM312.144 98.5716H295.715V32.8573H312.144V98.5716Z" fill="#F1ECEC"/>
<path d="M394.285 32.8573H344.999V82.143H394.285V98.5716H328.57V16.4287H394.285V32.8573Z" fill="#F1ECEC"/>
<path d="M459.997 32.8573H427.14V82.143H459.997V32.8573ZM476.425 98.5716H410.711V16.4287H476.425V98.5716Z" fill="#F1ECEC"/>
<path d="M542.145 32.8571H509.288V82.1429H542.145V32.8571ZM558.574 98.5714H492.859V16.4286H542.145V0H558.574V98.5714Z" fill="#F1ECEC"/>
<path d="M591.429 32.8573V49.2859H624.286V32.8573H591.429ZM640.714 65.7144H591.429V82.143H640.714V98.5716H575V16.4287H640.714V65.7144Z" fill="#F1ECEC"/>
</g>
</g>
<defs>
<clipPath id="clip0_1401_86315">
<rect width="640.714" height="115" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@@ -0,0 +1,22 @@
<svg width="640" height="115" viewBox="0 0 640 115" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1401_86353)">
<mask id="mask0_1401_86353" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="640" height="115">
<path d="M640 0H0V115H640V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_1401_86353)">
<path d="M49.2308 32.8573H16.4103V82.143H49.2308V32.8573ZM65.641 98.5716H0V16.4287H65.641V98.5716Z" fill="#211E1E"/>
<path d="M98.4649 82.143H131.285V32.8573H98.4649V82.143ZM147.696 98.5716H98.4649V115H82.0547V16.4287H147.696V98.5716Z" fill="#211E1E"/>
<path d="M229.743 65.7144H180.512V82.143H229.743V98.5716H164.102V16.4287H229.743V65.7144ZM180.512 49.2859H213.332V32.8573H180.512V49.2859Z" fill="#211E1E"/>
<path d="M295.387 32.8573H262.567V98.5716H246.156V16.4287H295.387V32.8573ZM311.797 98.5716H295.387V32.8573H311.797V98.5716Z" fill="#211E1E"/>
<path d="M393.844 32.8573H344.613V82.143H393.844V98.5716H328.203V16.4287H393.844V32.8573Z" fill="#211E1E"/>
<path d="M459.489 32.8573H426.668V82.143H459.489V32.8573ZM475.899 98.5716H410.258V16.4287H475.899V98.5716Z" fill="#211E1E"/>
<path d="M541.535 32.8571H508.715V82.1428H541.535V32.8571ZM557.946 98.5714H492.305V16.4286H541.535V0H557.946V98.5714Z" fill="#211E1E"/>
<path d="M590.77 32.8573V49.2859H623.59V32.8573H590.77ZM640 65.7144H590.77V82.143H640V98.5716H574.359V16.4287H640V65.7144Z" fill="#211E1E"/>
</g>
</g>
<defs>
<clipPath id="clip0_1401_86353">
<rect width="640" height="115" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 302 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 70 KiB

After

Width:  |  Height:  |  Size: 7.6 KiB

View File

@@ -1,3 +1,5 @@
import { A } from "@solidjs/router"
export function Legal() {
return (
<div data-component="legal">
@@ -5,10 +7,7 @@ export function Legal() {
©{new Date().getFullYear()} <a href="https://anoma.ly">Anomaly</a>
</span>
<span>
<a href="/brand">Brand</a>
</span>
<span>
<a href="/legal">Legal</a>
<A href="/brand">Brand</A>
</span>
</div>
)

View File

@@ -294,10 +294,12 @@
cursor: pointer;
display: flex;
width: fit-content;
gap: 32px;
align-items: center;
gap: 12px;
transition: background-color 0.2s ease;
text-decoration: none;
&:hover:not(:disabled) {
background: var(--color-background-strong-hover);
}
@@ -308,14 +310,83 @@
}
}
img {
width: 100%;
height: auto;
display: block;
[data-component="brand-grid"] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 4rem;
margin-bottom: 2rem;
}
[data-component="brand-grid"] img {
width: 100%;
height: auto;
display: block;
border-radius: 4px;
border: 1px solid var(--color-border-weak);
}
[data-component="brand-grid"] > div {
position: relative;
}
[data-component="actions"] {
position: absolute;
background: rgba(4, 0, 0, 0.08);
border-radius: 4px;
bottom: 0;
right: 0;
top: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
gap: 16px;
opacity: 0;
transition: opacity 0.2s ease;
@media (max-width: 60rem) {
position: static;
opacity: 1;
margin-top: 1rem;
justify-content: center;
}
}
[data-component="brand-grid"] > div:hover [data-component="actions"] {
opacity: 1;
@media (max-width: 60rem) {
opacity: 1;
}
}
[data-component="actions"] button {
padding: 6px 12px;
background: var(--color-background);
color: var(--color-text);
border: none;
border-radius: 4px;
font-weight: 500;
display: flex;
align-items: center;
gap: 12px;
transition: background-color 0.2s ease;
cursor: pointer;
box-shadow:
0 0 0 1px rgba(19, 16, 16, 0.08),
0 6px 8px -4px rgba(19, 16, 16, 0.12),
0 4px 3px -2px rgba(19, 16, 16, 0.12),
0 1px 2px -1px rgba(19, 16, 16, 0.12);
&:hover {
background: var(--color-background);
}
}
@media (max-width: 60rem) {
padding: 2rem 1.5rem;
}

View File

@@ -3,11 +3,23 @@ import { Title, Meta } from "@solidjs/meta"
import { Header } from "~/component/header"
import { Footer } from "~/component/footer"
import { Legal } from "~/component/legal"
import { Faq } from "~/component/faq"
import brand from "../../asset/lander/brand.png"
import previewLogoLight from "../../asset/brand/preview-opencode-logo-light.png"
import previewLogoDark from "../../asset/brand/preview-opencode-logo-dark.png"
import previewWordmarkLight from "../../asset/brand/preview-opencode-wordmark-light.png"
import previewWordmarkDark from "../../asset/brand/preview-opencode-wordmark-dark.png"
import previewWordmarkSimpleLight from "../../asset/brand/preview-opencode-wordmark-simple-light.png"
import previewWordmarkSimpleDark from "../../asset/brand/preview-opencode-wordmark-simple-dark.png"
export default function Brand() {
const downloadFile = (url: string, filename: string) => {
const link = document.createElement("a")
link.href = url
link.download = filename
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
}
return (
<main data-page="enterprise">
@@ -19,82 +31,183 @@ export default function Brand() {
<div data-component="content">
<section data-component="brand-content">
<h2>Brand guidelines</h2>
<p>
Resources and assets to help you work with the OpenCode brand.
</p>
<a data-component="download-button" href="#">Download brand assets<svg
width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path d="M12 6.5L12 17M7.5 13L12 17.5L16.5 13" stroke="currentColor"
stroke-width="1.5" stroke-linecap="square"/>
</svg>
</a>
<img src={brand} alt=""/>
<p>Resources and assets to help you work with the OpenCode brand.</p>
<button data-component="download-button">
Download all assets
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/>
</svg>
</button>
<p>If you need any help with anything brand related <a href="mailto:david@anoma.ly">contact us</a>.</p>
</section>
<section data-component="faq">
<div data-slot="section-title">
<h3>FAQ</h3>
<div data-component="brand-grid">
<div>
<img src={previewLogoLight} alt="OpenCode brand guidelines"/>
<div data-component="actions">
<button
onClick={() => downloadFile(LogoLight, "opencode-logo-light.png")}>
PNG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/>
</svg>
</button>
<button onClick={() => downloadFile(brandAssetsLight, "opencode-logo-light.svg")}>
SVG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/>
</svg>
</button>
</div>
</div>
<div>
<img src={previewLogoDark} alt="OpenCode brand guidelines"/>
<div data-component="actions">
<button
onClick={() => downloadFile(brand, "opencode-logo-dark.png")}>
PNG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
<button
onClick={() => downloadFile(brandAssetsLight, "opencode-logo-dark.svg")}>
SVG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
</div>
</div>
<div>
<img src={previewWordmarkLight} alt="OpenCode brand guidelines"/>
<div data-component="actions">
<button
onClick={() => downloadFile(brand, "opencode-wordmark-light.png")}>
PNG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
<button
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-light.svg")}>
SVG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
</div>
</div>
<div>
<img src={previewWordmarkDark} alt="OpenCode brand guidelines"/>
<div data-component="actions">
<button
onClick={() => downloadFile(brand, "opencode-wordmark-dark.png")}>
PNG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
<button
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-dark.svg")}>
SVG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
</div>
</div>
<div>
<img src={previewWordmarkSimpleLight} alt="OpenCode brand guidelines"/>
<div data-component="actions">
<button
onClick={() => downloadFile(brand, "opencode-wordmark-simple-light.png")}>
PNG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
<button
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-simple-light.svg")}>
SVG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
</div>
</div>
<div>
<img src={previewWordmarkSimpleDark} alt="OpenCode brand guidelines"/>
<div data-component="actions">
<button
onClick={() => downloadFile(brand, "opencode-wordmark-simple-dark.png")}>
PNG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
<button
onClick={() => downloadFile(brandAssetsLight, "opencode-wordmark-simple-dark.svg")}>
SVG
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.9583 10.6247L10 14.583L6.04167 10.6247M10 2.08301V13.958M16.25 17.9163H3.75"
stroke="currentColor" stroke-width="1.5"
stroke-linecap="square"/>
</svg>
</button>
</div>
</div>
</div>
<ul>
<li>
<Faq question="Does Opencode store our code or context data?">
No. OpenCode never stores your code or context data. All
processing happens locally or directly with your AI provider.
</Faq>
</li>
<li>
<Faq question="Who owns the code generated with OpenCode?">
You do. All code produced is yours, with no licensing
restrictions or ownership claims.
</Faq>
</li>
<li>
<Faq
question="How can we trial OpenCode inside our organization?">
Simply install and run an internal trial with your team. Since
OpenCode doesnt store any data, your developers can get
started right away.
</Faq>
</li>
<li>
<Faq
question="What happens if someone uses the `/share` feature?">
By default, sharing is disabled. If enabled, conversations are
sent to our share service and cached through our CDN. For
enterprise use, we recommend disabling or self-hosting this
feature.
</Faq>
</li>
<li>
<Faq question="Can OpenCode integrate with our companys SSO?">
Yes. Enterprise deployments can include SSO integration so all
sessions and shared conversations are protected by your
authentication system.
</Faq>
</li>
<li>
<Faq question="Can OpenCode be self-hosted?">
Absolutely. You can fully self-host OpenCode, including the
share feature, ensuring that data and pages are accessible
only after authentication.
</Faq>
</li>
<li>
<Faq
question="How do we get started with enterprise deployment?">
Contact us to discuss pricing, implementation, and enterprise
options like SSO, private registries, and self-hosting.
</Faq>
</li>
</ul>
</section>
</div>
<Footer />
<Footer/>
</div>
<Legal />
<Legal/>
</main>
)
}