contact #1
1
Color options
Customize your colors.
<section>
<div class="relative px-8 py-32 mx-auto md:px-12 lg:px-24 max-w-7xl">
<div class="max-w-xl mx-auto text-center lg:text-balance">
<p class="text-sm font-bold uppercase text-blue-600">Tagline</p>
<h2
class="text-2xl md:text-3xl lg:text-4xl mt-4 font-semibold text-base-900 lg:text-balance"
>
We would love to hear from you!
</h2>
<p class="text-base mt-4 font-medium text-base-500">
Uniting talent with vision. Get to know the dedicated professionals who
blend their skills and passion to lead us to new heights.
</p>
</div>
<dl
class="mt-12 text-center grid sm:grid-cols-2 gap-x-6 gap-y-12 lg:grid-cols-4 lg:gap-x-8 lg:gap-y-16"
>
<div class="flex flex-col justify-between h-full text-sm">
<div>
<dt class="flex flex-col gap-2">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-arrow-credit-card size-5 mx-auto text-blue-500"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path
d="M3 5m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z"
></path>
<path d="M3 10l18 0"></path>
<path d="M7 15l.01 0"></path>
<path d="M11 15l2 0"></path>
</svg>
<h3 class="text-lg md:text-xl font-medium text-base-900">Sales</h3>
</dt>
<dd>
<p class="text-base mt-2 font-medium text-base-500">
Find out how Oxbow UI can help your business.
</p>
</dd>
</div>
<a
class="text-base flex items-center mx-auto mt-4 font-medium text-blue-500 gap-2 hover:text-base-900"
href="#_"
>
Talk to sales
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-chevron-right size-4"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M9 6l6 6l-6 6"></path>
</svg>
</a>
</div>
<div class="flex flex-col justify-between h-full text-sm">
<dt>
<div class="flex flex-col text-xs tracking-tighter gap-2">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-arrow-lifebuoy size-5 mx-auto text-blue-500"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>
<path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path>
<path d="M15 15l3.35 3.35"></path>
<path d="M9 15l-3.35 3.35"></path>
<path d="M5.65 5.65l3.35 3.35"></path>
<path d="M18.35 5.65l-3.35 3.35"></path>
</svg>
<h3 class="text-lg md:text-xl font-medium text-base-900">
Support
</h3>
</div>
</dt>
<dd>
<p class="text-base font-medium text-base-500">
Find out how Oxbow UI can help your business. Have a support
question? We’ve got answers.
</p>
</dd>
<a
class="text-base flex items-center mx-auto mt-4 font-medium text-blue-500 gap-2 hover:text-base-900"
href="#_"
>
Talk to support
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-chevron-right size-4"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M9 6l6 6l-6 6"></path>
</svg>
</a>
</div>
<div class="flex flex-col justify-between h-full text-sm">
<div>
<dt class="flex flex-col text-xs tracking-tighter gap-2">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-arrow-news size-5 mx-auto text-blue-500"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path
d="M16 6h3a1 1 0 0 1 1 1v11a2 2 0 0 1 -4 0v-13a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1v12a3 3 0 0 0 3 3h11"
></path>
<path d="M8 8l4 0"></path>
<path d="M8 12l4 0"></path>
<path d="M8 16l4 0"></path>
</svg>
<h3 class="text-lg md:text-xl font-medium text-base-900">Press</h3>
</dt>
<dd>
<p class="text-base mt-2 font-medium text-base-500">
Any media questions or publication ideas you have, we’re happy to
connect.
</p>
</dd>
</div>
<a
class="text-base flex items-center mx-auto mt-4 font-medium text-blue-500 gap-2 hover:text-base-900"
href="#_"
>
Talk to press
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-chevron-right size-4"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M9 6l6 6l-6 6"></path>
</svg>
</a>
</div>
<div class="flex flex-col justify-between h-full text-sm">
<div>
<dt class="flex flex-col text-xs tracking-tighter gap-2">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-arrow-user-plus size-5 mx-auto text-blue-500"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M5 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0"></path>
<path
d="M3 21v-2a4 4 0 0 1 4 -4h4c.96 0 1.84 .338 2.53 .901"
></path>
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
<path d="M16 19h6"></path>
<path d="M19 16v6"></path>
</svg>
<h3 class="text-lg md:text-xl font-medium text-base-900">
Partners
</h3>
</dt>
<dd>
<p class="text-base mt-2 font-medium text-base-500">
We love partnering with other businesses. Let us know what you’re
thinking.
</p>
</dd>
</div>
<a
class="text-base flex items-center mx-auto mt-4 font-medium text-blue-500 gap-2 hover:text-base-900"
href="#_"
>
Meet our partners
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="icon icon-tabler-chevron-right size-4"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M9 6l6 6l-6 6"></path>
</svg>
</a>
</div>
</dl>
</div>
</section>