index.html

---
layout: default
custom-styles:
  - "/assets/css/home.css"
---

<div>
  <!-- Top of page with background -->
  <div class="cover bg-opaque-image-top-left container-fluid d-flex mx-auto bg-primary text-white">
    <div class="container d-flex align-items-center">
      <div class="text-center mx-auto">
        <h1 class="cover-lead text-center">Next Gen Risk Management<br>Starts Here</h1>
        <p class="text-center lead">
        Community support for OSCAL-enabled applications
        </p>
        <a class="btn btn-lg btn-secondary" href="/#about">Learn More</a>
        <a class="btn btn-lg btn-primary" href="/events/">View Events</a>
      </div>
    </div>
  </div>

  <div class="bg-opaque-image-bottom-left">
    <div class="container my-5 bg-opaque-image-bottom-left">
      <div class="row g-5 align-items-center pt-3">
        <div class="d-none d-lg-block col-md-6 col-sm-12">
          <img
            src="{{ '/assets/img/oscal-layers.svg' | relative_url }}"
            alt="The layers of OSCAL: the assessment layer, comprised of plan of action and milestones, assessment results, and assessment plans; the implementation layer, comprised of the System Security Plan Model and the Component Model; and the Controls Layer, comprised of the Profile Model and the Catalog Model"
           />
        </div>
        <div class="col-lg-6 col-sm-12">
          <h2 id="about" class="h1">About OSCAL.io</h2>
          <p class="pt-2 lead">
            The <a href="https://pages.nist.gov/OSCAL/" target="_blank">Open Security Controls Assessment Language (OSCAL)</a> was
            developed by the National Institute of Standards and
            Technology (NIST) to enable automation of risk management and compliance framework based on security controls and
            functional requirements, such as SOC 2, FedRAMP, ISO-27001, StateRAMP, CMMC, HIPAA, and PCI. OSCAL is an open
            machine-readable information exchange format that enables tools to interoperate.
          </p>
          <p class="pb-2 lead">
            OSCAL was released on June 10, 2021 and several vendors are OSCAL-enabling their tools. These tools can be enhanced by a
            common repository of OSCAL resources.
          </p>
          <a href="https://pages.nist.gov/OSCAL" class="btn btn-secondary btn-lg align-items-center" target="_blank">
            <span>Learn More</span>
            <img class="btn-arrow-icon" src="{{ "/assets/img/arrow.svg" | relative_url }}" alt="">
          </a>
        </div>
      </div>
    </div>

    <div class="my-5">
      <h2 class="text-center h1">OSCAL.io Goals</h2>
      <!-- Cards -->
      <div class="container">
        <div class="row row-cols-1 row-cols-md-3 g-5">
          <div class="col">
            <div class="bg-navy text-white p-4 h-100">
              <i class="bi-people-fill text-secondary goal-icon user-select-none"></i>
              <h3>Community Hub</h3>
              <p>To provide community resources for OSCAL adopters and OSCAL-enabled tools</p>
            </div>
          </div>
          <div class="col">
            <div class="bg-navy text-white p-4 h-100">
              <i class="bi-search text-secondary goal-icon user-select-none"></i>
              <h3>Automate Discovery</h3>
              <p>Provide an Application Programming Interface (API) for tools to automatically query for OSCAL resources</p>
            </div>
          </div>
          <div class="col">
            <div class="bg-navy text-white p-4 h-100">
              <i class="bi-megaphone-fill text-secondary goal-icon user-select-none"></i>
              <h3>Promote Adoption</h3>
              <p>Enable new OSCAL adopters to get started</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="mb-5 bg-primary text-white py-5">
    <div class="container my-5">
      <h2 class="pb-4 h1">What to Expect</h2>
      <div class="row row-cols-xl-4 row-cols-md-2 row-cols-sm-1 g-5">
        <div class="col">
          <div class="p-4 border border-1 border-secondary h-100">
            <p class="outline-header-num user-select-none">01</p>
            <h3>Upcoming OSCAL Events</h3>
            <p>Discover virtual and in-person events related to OSCAL, or add your organization's event.</p>
          </div>
        </div>
        <div class="col">
          <div class="p-4 border border-1 border-secondary h-100">
            <p class="outline-header-num user-select-none">02</p>
            <h3>OSCAL Communication Channels</h3>
            <p>Find out where your OSCAL colleagues are communicating with each other.</p>
          </div>
        </div>
        <div class="col">
          <div class="p-4 border border-1 border-secondary h-100">
            <p class="outline-header-num user-select-none">03</p>
            <h3>OSCAL Content Directory and Repository</h3>
            <p>Make your OSCAL catalogs, baselines (profiles) and component definitions available to all OSCAL tools.</p>
          </div>
        </div>
        <div class="col">
          <div class="p-4 border border-1 border-secondary h-100">
            <p class="outline-header-num user-select-none">04</p>
            <h3>OSCAL-Enabled Tools Directory</h3>
            <p>Find existing OSCAL-enabled tools or list your own.</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="mb-5 bg-opaque-image-bottom-right">
    <h2 id="events" class="text-center h1">Community Events</h2>
    <div class="container">
      <div class="row row-cols-1 row-cols-md-3 g-4">
        {%
          assign upcomingEvents = site.events
            | where_exp: "event", "event.start-date >= site.time"
        %}
        {% for event in upcomingEvents limit: 6 %}
          {% include event-card.html event=event %}
        {% endfor %}
      </div>
      {% if upcomingEvents.size > 6 %}
      <div class="text-center mt-2">
        <a class="btn btn-secondary btn-lg" href="/events/">See More</a>
      </div>
      {% endif %}
    </div>
  </div>
</div>