| title | C1 documentation |
|---|---|
| mode | custom |
{/* Hero Section */}
Everything you need to configure, extend, and get the most out of C1.
<div className="flex items-center justify-center" style={{ maxWidth: '800px', margin: '0 auto' }}>
<button
type="button"
className="hidden w-full lg:flex items-center text-sm leading-6 py-4 pl-4 pr-4 text-gray-500 rounded-full"
id="home-search-entry"
style={{
marginTop: '2rem',
maxWidth: '40rem',
boxShadow: '0px 1px 4px 0px rgba(8, 9, 10, 0.25), 0px 0px 0px 4px rgba(255, 255, 255, 0.20)',
cursor: 'pointer',
textAlign: 'left',
}}
onClick={()=> document.getElementById('search-bar-entry').click()}
>
<svg
className="h-4 w-4 ml-1.5 flex-none bg-primary hover:bg-gray-600 dark:bg-primary-dark dark:hover:bg-white/70"
style={{
marginRight: '0.5rem',
maskImage:
'url("https://mintlify.b-cdn.net/v6.5.1/solid/magnifying-glass.svg")',
maskRepeat: 'no-repeat',
maskPosition: 'center center',
}}
/>
Search or ask...
</button>
</div>
</div>
{/* Features Grid */}
<div className="grid md:grid-cols-2 lg:grid-cols-2 gap-8">
{/* Feature Card 1 */}
<div className="group rounded-xl p-8 border border-slate-200 dark:border-slate-800 hover:shadow-xl transition-all duration-300" style={{ '--hover-border': '#1e5f67' }} onMouseEnter={(e) => e.currentTarget.style.borderColor = '#1e5f67'} onMouseLeave={(e) => e.currentTarget.style.borderColor = ''}>
<div className="w-12 h-12 bg-[#e0f4f4] dark:bg-[#0d3338] rounded-lg flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
<Icon icon="compass" size={24} color="#1e5f67" />
</div>
<h3 className="text-xl font-semibold text-slate-900 dark:text-white mb-3">
Use C1
</h3>
<p className="text-slate-600 dark:text-slate-400 leading-relaxed">
Request access, complete review tasks, and use AI tools and MCP clients as an end user of C1.
</p>
<a href="/docs/product/how-to/intro" className="inline-flex items-center mt-4 font-medium hover:underline text-[#1e5f67] dark:text-[#8acfcd]">
Learn more
<svg className="ml-1 w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</a>
</div>
{/* Feature Card 2 */}
<div className="group rounded-xl p-8 border border-slate-200 dark:border-slate-800 hover:shadow-xl transition-all duration-300" onMouseEnter={(e) => e.currentTarget.style.borderColor = '#c937ae'} onMouseLeave={(e) => e.currentTarget.style.borderColor = ''}>
<div className="w-12 h-12 bg-[#fce4f7] dark:bg-[#3d0e2d] rounded-lg flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
<Icon icon="gear" size={24} color="#c937ae" />
</div>
<h3 className="text-xl font-semibold text-slate-900 dark:text-white mb-3">
Administer C1
</h3>
<p className="text-slate-600 dark:text-slate-400 leading-relaxed">
Automate security for all your human, non-human, and AI identities. Run access reviews, enable self-service access, and set up just-in-time access for key resources.
</p>
<a href="/docs/product/intro" className="inline-flex items-center mt-4 font-medium hover:underline text-[#c937ae] dark:text-[#e87fd3]">
Learn more
<svg className="ml-1 w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</a>
</div>
{/* Feature Card 3 */}
<div className="group rounded-xl p-8 border border-slate-200 dark:border-slate-800 hover:shadow-xl transition-all duration-300" onMouseEnter={(e) => e.currentTarget.style.borderColor = '#c937ae'} onMouseLeave={(e) => e.currentTarget.style.borderColor = ''}>
<div className="w-12 h-12 bg-[#fce4f7] dark:bg-[#3d0e2d] rounded-lg flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
<svg className="w-6 h-6" style={{ color: '#c937ae' }} fill="currentColor" viewBox="0 0 16 16">
<path fillRule="evenodd" d="M11.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5zm-2.25.75a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.492 2.492 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25zM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5zM3.5 3.25a.75.75 0 1 1 1.5 0 .75.75 0 0 1-1.5 0z"/>
</svg>
</div>
<h3 className="text-xl font-semibold text-slate-900 dark:text-white mb-3">
Connectors
</h3>
<p className="text-slate-600 dark:text-slate-400 leading-relaxed">
Pre-built connectors for Okta, Google Workspace, AWS, GitHub, and more. Build custom connectors to integrate any app, even niche or legacy systems.
</p>
<a href="/docs/baton/intro" className="inline-flex items-center mt-4 font-medium hover:underline text-[#c937ae] dark:text-[#e87fd3]">
Learn more
<svg className="ml-1 w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</a>
</div>
{/* Feature Card 4 */}
<div className="group rounded-xl p-8 border border-slate-200 dark:border-slate-800 hover:shadow-xl transition-all duration-300" style={{ '--hover-border': '#1e5f67' }} onMouseEnter={(e) => e.currentTarget.style.borderColor = '#1e5f67'} onMouseLeave={(e) => e.currentTarget.style.borderColor = ''}>
<div className="w-12 h-12 bg-[#e0f4f4] dark:bg-[#0d3338] rounded-lg flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
<svg className="w-6 h-6" style={{ color: '#1e5f67' }} fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" />
</svg>
</div>
<h3 className="text-xl font-semibold text-slate-900 dark:text-white mb-3">
Developer
</h3>
<p className="text-slate-600 dark:text-slate-400 leading-relaxed">
Work with our Go and TypeScript SDKs, Terraform provider, and Postman integration. Integrate with, manage, and extend the C1 platform programmatically.
</p>
<a href="/docs/developer/intro" className="inline-flex items-center mt-4 font-medium hover:underline text-[#1e5f67] dark:text-[#8acfcd]">
Learn more
<svg className="ml-1 w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</a>
</div>
{/* Feature Card 5 */}
<div className="group rounded-xl p-8 border border-slate-200 dark:border-slate-800 hover:shadow-xl transition-all duration-300" style={{ '--hover-border': '#1e5f67' }} onMouseEnter={(e) => e.currentTarget.style.borderColor = '#1e5f67'} onMouseLeave={(e) => e.currentTarget.style.borderColor = ''}>
<div className="w-12 h-12 bg-[#e0f4f4] dark:bg-[#0d3338] rounded-lg flex items-center justify-center mb-4 group-hover:scale-110 transition-transform">
<svg className="w-6 h-6" style={{ color: '#1e5f67' }} fill="none" stroke="currentColor" viewBox="0 0 24 24">
<title>API</title>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
</svg>
</div>
<h3 className="text-xl font-semibold text-slate-900 dark:text-white mb-3">
API
</h3>
<p className="text-slate-600 dark:text-slate-400 leading-relaxed">
Extend C1's power into your own ecosystem. Automate access requests, export audit data for compliance reporting, and integrate identity security directly into your internal tools and developer workflows.
</p>
<a href="/docs/conductorone-api/api" className="inline-flex items-center mt-4 font-medium hover:underline text-[#1e5f67] dark:text-[#8acfcd]">
Learn more
<svg className="ml-1 w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</a>
</div>
</div>