index.html

---
layout: homepage
title: Home
---
<section class="cIntro">
   <div class="container">
      <div class="row">
         <div class="col-sm-12 col-md-12 col-lg-12">
          
            <img class="cIntroLogo cBlackLogo" alt="OpenChoreo logo" src="/img/oplogo-Recovered-b.webp"/>
             <img class="cIntroLogo cWhiteLogo" alt="OpenChoreo logo" src="/img/oplogo-Recovered-w.webp"/>
            <h1>The IDP you can start using today
            </h1>
            <!-- <h2>Build. Deploy. Scale. Effortlessly.
            </h2> -->
            <p style="margin-bottom: 40px;">A complete, open-source Internal Developer Platform—ready to use from day one, 
built to integrate with your stack.

            </p>
            <a href="https://github.com/openchoreo/openchoreo" class="cButton cButtonIcon">Get Started</a>
            <a href="https://github.com/openchoreo/openchoreo" class="cOutlineButton">Learn More </a>
         </div>
<!-- <div class="col-sm-12 col-md-7 col-lg-7">
<img style="width: 100%;" src="https://wso2.cachefly.net/wso2/sites/all/image_resources/choreo/automate-workflows2.webp"/>
</div> -->
         
      </div>
   </div>
   </div>
</section>
<section class=" cLightBackground">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <h2>What is OpenChoreo?</h2>
         </div>
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <span class="cH2Line"></span>
         </div>
      </div>
      <div class="row">
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
         <div
            class="col-lg-8 col-md-8 col-sm-8 col-xs-8 d-flex justify-content-center list-unstyled cTextAlignCenter">
            <p style="margin-bottom: 100px;">
OpenChoreo is an internal developer platform that helps platform engineering teams streamline developer workflows, simplify complexity, and deliver secure, scalable Internal Developer Portals — without building everything from scratch.

            </p>
         </div>
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
      </div>
      <div class="row">
         <div class="col-sm-12 col-md-12 col-lg-12 cVideoContainer">
            <div class="cVideoContainerInner">
               <video class="cVideo" style=" width: 100%;" class="aos-init aos-animate" data-aos="zoom-in"
                  autoplay="" loop="" muted="">
                  <source src="./img/V3_name_added.webm" type="video/webm">
               </video>
            </div>
         </div>
      </div>
   </div>
</section>

<section class="cDarkBackground">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <h2>What You Get with OpenChoreo</h2>
         </div>
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <span class="cH2Line"></span>
         </div>
      </div>
      <div class="row">
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
         <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 d-flex justify-content-center list-unstyled cTextAlignCenter">
            <p style="margin-bottom: 100px;">
 OpenChoreo isn’t just a toolkit—it’s a full foundation for building your Internal Developer Platform. It brings clarity, security, and self-service to every stage of your developer experience.
 </p>
         </div>
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
      </div>

     
      <div class="row">
         <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_Golden_paths_by_design.webp" class="cIcon" />
               <h3>Golden Paths by Design</h3>
               <p>Define opinionated workflows that guide developers from idea to production—without writing pipelines from
                  scratch.</p>
            </div>
         </div>

           <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_Zero_trust_security.webp" class="cIcon" />
               <h3>Zero Trust Security Built In</h3>
               <p>Every connection and endpoint is explicitly declared and enforced via mTLS and Cilium policies—no implicit access, ever.</p>
            </div>
         </div>

           <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_observable_by_default.webp" class="cIcon" />
               <h3>Observable by Default</h3>
               <p>Logs, metrics, and traces are automatically captured across gateways and services—no extra setup needed.</p>
            </div>
         </div>

           <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_Composable_&_extensible.webp" class="cIcon" />
               <h3>Composable and Extensible</h3>
               <p>Use just what you need. OpenChoreo integrates with your stack, supports GitOps, and adapts to your platform strategy.</p>
            </div>
         </div>

           <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_Clear_seperation_of_concerns.webp" class="cIcon" />
               <h3>Clear Separation of Concerns</h3>
               <p>Platform engineers define the guardrails. Developers focus on delivering value.</p>
            </div>
         </div>

           <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_Service_catalog_and_discoverability.webp" class="cIcon" />
               <h3>Service Catalog and Discoverability
</h3>
               <p>APIs, events, and data streams are registered with metadata—making reuse and governance easy.
</p>
            </div>
         </div>
 <div class="col-sm-12 col-md-4 col-lg-4">&nbsp;</div>
           <div class="col-sm-12 col-md-4 col-lg-4">
            <div class="cCard cWithoutBoxshadow">
               <img src="/img/open-choreo-icons_Built_in_APIM.webp" class="cIcon" />
               <h3>Built-in API Management</h3>
               <p>Expose APIs through Envoy-based gateways with support for routing, rate limits, auth, and traffic control—no manual config needed.</p>
            </div>
         </div>

            <div class="col-sm-12 col-md-4 col-lg-4">&nbsp;</div>
      
        
         
      </div>
   </div>
</section>




<section class="cLightBackground">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <h2>Get Started with OpenChoreo</h2>
         </div>
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <span class="cH2Line"></span>
         </div>



      </div>
      <div class="row">
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
         <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 d-flex justify-content-center list-unstyled cTextAlignCenter">
            <p style="margin-bottom: 100px;">Skip the setup headaches. Pick what works for you and get hands-on.
            </p>
         </div>
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
      </div>


      <div class="row">
         <div class="col-sm-12 col-md-6 col-lg-6">
            <div class="cCard cButtonContainer d-flex flex-column align-items-center text-center h-100 px-3 py-4">
               <div class="w-100">
                  <h3>Quick Start</h3>
                  <p class="cStrong">Run OpenChoreo locally with a single command.</p>
                  <ul class="text-start mx-auto" style="max-width: 500px;">
                     <li>No config, no toolchain juggling.</li>
                     <li>Comes with everything preinstalled.</li>
                     <li>Safe to explore and easy to clean up when you’re done.</li>
                  </ul>
               </div>

               <!-- Button centered at the bottom -->
               <a class="cButton cOutlineCTA cQuickStart mt-auto mx-auto"
                  href="https://github.com/openchoreo/openchoreo/blob/main/docs/quick-start-guide.md">
               Quick Start Guide
               </a>
            </div>
         </div>
         <div class="col-sm-12 col-md-6 col-lg-6">
            <div class="cCard cButtonContainer d-flex flex-column align-items-center text-center h-100 px-3 py-4">
               <h3>Install on Your Cluster</h3>
               <p class="cStrong">Set up OpenChoreo on your own Kubernetes cluster.</p>
               <ul>
                  <li>Use Helm to install the Control Plane and Data Plane.</li>
                  <li>Works with kind or any Cilium-enabled cluster.</li>
                  <li>A good option if you want to understand how things are wired under the hood.</li>



               </ul>
               <a class="cButton cOutlineCTA cFlexibleInstall mt-auto mx-auto"
                  href="https://github.com/openchoreo/openchoreo/blob/main/docs/install-guide.md"> Full Install Guide</a>


            </div>
         </div>

             <div class="col-sm-12 col-md-12 col-lg-12" style="padding-top: 60px;">
            <div class=" d-flex flex-column align-items-center text-center h-100 px-3 py-4">
              <p>Explore OpenChoreo using ready-to-run sample apps. </p>
        
               <a class="cButton cOutlineCTA cFlexibleInstall mt-auto mx-auto" style="min-width: 220px; margin-bottom: 0;"
                  href="https://github.com/openchoreo/openchoreo/blob/main/docs/install-guide.md"> See Examples</a>


            </div>
         </div>


        
    
      </div>
   </div>
</section>



<section class="cDarkBackground">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <h2>Built on the Cloud Native Stack</h2>
         </div>
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <span class="cH2Line"></span>
         </div>
      </div>
      <div class="row">
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
         <div
            class="col-lg-8 col-md-8 col-sm-8 col-xs-8 d-flex justify-content-center list-unstyled cTextAlignCenter">
            <p style="margin-bottom: 100px;">OpenChoreo orchestrates CNCF and open-source tools like Kubernetes, Argo CD, Cilium, Backstage, and more to provide a production-grade IDP.</p>
         </div>
         <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
            &nbsp;
         </div>
      </div>
   </div>
   <div class="container">

   
    
      <div class="d-flex flex-wrap gap-3 d-flex justify-content-center list-unstyled ">




<div class="tooltip-container cLogos">
   <a href="https://kubernetes.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-09.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Kubernetes</h2>
        <p>Orchestrates all components across environments. OpenChoreo workloads run natively as Kubernetes resources.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>


<div class="tooltip-container cLogos">
   <a href="https://helm.sh/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-10.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Kubernetes</h2>
        <p>Manages the OpenChoreo installation.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>


<div class="tooltip-container cLogos">
   <a href="https://argoproj.github.io/workflows/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-02.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Argo Workflows</h2>
        <p>Powers OpenChoreo’s built-in CI/CD. Automates build, test, and deploy pipelines across environments and tracks.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>




<div class="tooltip-container cLogos">
   <a href="https://buildpacks.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-03.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>BuildPacks.io</h2>
        <p>Enables zero-config builds in OpenChoreo’s built-in CI</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>




<div class="tooltip-container cLogos">
   <a href="https://ebpf.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-04.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>eBPF</h2>
        <p>Enables low-level observability and security. OpenChoreo uses eBPF (via Cilium and Hubble) to monitor and trace network behavior.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>



<div class="tooltip-container cLogos">
   <a href="https://cilium.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-05.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Cilium</h2>
        <p>Provides zero-trust network policies and service connectivity between components.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>




<div class="tooltip-container cLogos">
   <a href="https://opensearch.org/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-11.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>OpenSearch</h2>
        <p>Stores structured logs and supports querying and alerting for all platform events.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>



<div class="tooltip-container cLogos">
   <a href="https://fluentbit.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-07.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>FluentBit</h2>
        <p>Collects and ships logs from workloads to OpenSearch with low resource overhead.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>


<div class="tooltip-container cLogos">
   <a href="https://prometheus.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-08.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Prometheus</h2>
        <p>Scrapes metrics from workloads and platform components for monitoring and autoscaling.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>



<div class="tooltip-container cLogos">
   <a href="https://thanos.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-06.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Thanos</h2>
        <p>Adds long-term storage and federation to Prometheus, enabling historical observability across clusters.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>


<div class="tooltip-container cLogos">
   <a href="https://github.com/cilium/hubble" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-01.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Hubble</h2>
        <p>Visualizes runtime network flows and helps debug service-to-service communication.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>



<div class="tooltip-container cLogos">
   <a href="https://gateway.envoyproxy.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-12.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Envoy Gateway</h2>
        <p>Exposes APIs and components securely. Forms the backbone of OpenChoreo ingress and egress.</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>


<div class="tooltip-container cLogos">
   <a href="https://wso2.com/choreo/" target="_blank" class="tooltip-target">
      <img src="/img/logos/wso2-14.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>WSO2</h2>
        <p>Inspired the architecture and best practices behind OpenChoreo. Many concepts are battle-tested in WSO2 Choreo (IDP as a Service).</p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>

<div class="tooltip-container cLogos">
   <a href="https://backstage.io/" target="_blank" class="tooltip-target">
      <img src="/img/logos/logos-13.webp" />
   </a>
  <div class="custom-tooltip bottom">
      <div class="tooltip-content">
        <h2>Backstage</h2>
        <p>OpenChoreo provides a Backstage plugin that integrates with its core APIs. </p>
      </div>
      <div class="tooltip-arrow"></div>
    </div>
</div>
     </div>
   </div>
</section>


<section class="cLightBackground">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <h2>Join the OpenChoreo Community</h2>
         </div>
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <span class="cH2Line"></span>
         </div>
      </div>
      <div class="row">
         <div class="col-sm-12 col-md-4 col-lg-4">
            <div class=" cButtonContainer">
               <a class="cButton cOutlineCTA cContribute"
                  href="https://github.com/openchoreo/openchoreo/blob/main/docs/contributors/README.md">
               Contribute</a>
               <p>Help shape OpenChoreo by submitting features, fixes, or improvements.</p>
            </div>
         </div>
         <div class="col-sm-12 col-md-4 col-lg-4">
            <div class=" cButtonContainer">
               <a class="cButton cOutlineCTA cReportIssues" href="https://github.com/openchoreo/openchoreo/issues">
               Report Issues </a>
               <p> Identify bugs and suggest enhancements to make the platform better for everyone.</p>
            </div>
         </div>
         <div class="col-sm-12 col-md-4 col-lg-4">
            <div class=" cButtonContainer">
               <a class="cButton cOutlineCTA cJoinOurDiscord" href="https://discord.com/invite/asqDFC8suT"> Join
               Our Discord</a>
               <p>Get real-time support, ask questions, and engage with other users and maintainers.</p>
            </div>
         </div>
         <div
            class="col-sm-12 col-md-12 col-lg-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <p class="cLastLines">We’re building OpenChoreo with you — for the next generation of platform
               engineering.
            </p>
         </div>
      </div>
   </div>
</section>




<section class="cDarkBackground">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 d-flex justify-content-center list-unstyled ">
            <h2>Ready to build the platform you always wanted?</h2>
         </div>
      
      </div>
      <div class="row">
         <div class="col-sm-12 col-md-4 col-lg-4">
       
            
         </div>
         <div class="col-sm-12 col-md-4 col-lg-4">
            <div class=" cButtonContainer">
               <a class="cButton cButtonIcon" href="https://github.com/openchoreo/openchoreo">Explore OpenChoreo </a>
              
            </div>
         </div>
         <div class="col-sm-12 col-md-4 col-lg-4">
          
            
         </div>
      
         
      </div>
   </div>
</section>