---
layout: base
title: Swagger & OpenAPI Online Validator
image: online/img/card.png
---

<div class="site-wrapper">
  <div class="responsive-container">
    <header class="clearfix">
      <h1>
        <span>Swagger/OpenAPI</span>
        <small>online validator</small>
      </h1>
      <nav>
        <ul class="nav">
          <li class="active"><a id="nav-demo" href="#">Demo</a></li>
          <li>
            <a id="nav-source" href="https://github.com/APIDevTools/swagger-parser">Source</a>
          </li>
          <li>
            <a id="nav-api" href="https://apitools.dev/swagger-parser/docs/">API</a>
          </li>
          <li>
            <a id="nav-cli" href="https://apitools.dev/swagger-cli/">CLI</a>
          </li>
        </ul>
      </nav>
    </header>

    <div class="main-content">
      <form id="swagger-parser-form" method="get" action="index.html">
        <div class="dropdowns-wrapper">

          <div class="keep-together">
            <div class="dropdown">
              <a id="allow-dropdown-toggle" href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <span id="allow-label">Allow all file types</span> <span class="caret"></span>
              </a>
              <ul id="allow-menu" class="dropdown-menu">
                <li><a id="allow-json" class="checkbox"><label>
                  <input type="checkbox" name="allow-json" value="yes" data-value="JSON" checked autocomplete="off"> Allow JSON
                </label></a></li>
                <li><a id="allow-yaml" class="checkbox"><label>
                  <input type="checkbox" name="allow-yaml" value="yes" data-value="YAML" checked autocomplete="off"> Allow YAML
                </label></a></li>
                <li><a id="allow-text" class="checkbox"><label>
                  <input type="checkbox" name="allow-text" value="yes" data-value="text" checked autocomplete="off"> Allow plain text
                </label></a></li>
                <li><a id="allow-empty" class="checkbox"><label>
                  <input type="checkbox" name="allow-empty" value="yes" data-value="empty" checked autocomplete="off"> Allow empty files
                </label></a></li>
                <li><a id="allow-unknown" class="checkbox"><label>
                  <input type="checkbox" name="allow-unknown" value="yes" data-value="unknown" checked autocomplete="off"> Allow unknown file types
                </label></a></li>
              </ul>
            </div>

            <div class="dropdown">
              <a id="refs-dropdown-toggle" href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <span id="refs-label">Follow all $refs</span> <span class="caret"></span>
              </a>
              <ul id="refs-menu" class="dropdown-menu">
                <li><a id="refs-internal" class="checkbox"><label>
                  <input type="checkbox" name="refs-internal" value="yes" data-value="internal" checked disabled autocomplete="off"> Follow internal $refs
                </label></a></li>
                <li><a id="refs-external" class="checkbox"><label>
                  <input type="checkbox" name="refs-external" value="yes" data-value="external" checked autocomplete="off"> Follow external $refs
                </label></a></li>
                <li><a id="refs-circular" class="checkbox"><label>
                  <input type="checkbox" name="refs-circular" value="yes" data-value="circular" checked autocomplete="off"> Follow circular $refs
                </label></a></li>
              </ul>
            </div>
          </div>

          <div class="keep-together">
            <div class="dropdown">
              <a id="validate-dropdown-toggle" href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <span id="validate-label">Validate everything</span> <span class="caret"></span>
              </a>
              <ul id="validate-menu" class="dropdown-menu">
                <li><a id="validate-schema" class="checkbox"><label>
                  <input type="checkbox" name="validate-schema" value="yes" data-value="schema" checked autocomplete="off"> Validate against Swagger/OpenAPI schema
                </label></a></li>
                <li><a id="validate-spec" class="checkbox"><label>
                  <input type="checkbox" name="validate-spec" value="yes" data-value="spec" checked autocomplete="off"> Validate against Swagger/OpenAPI spec
                </label></a></li>
              </ul>
            </div>
          </div>

          <div class="button-wrapper">
            <div class="btn-group btn-group-lg clearfix">
              <button type="submit" name="method" value="validate" class="btn btn-lg btn-primary">Validate it!</button>
              <button type="button" class="btn btn-lg btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <span class="caret"></span>
                <span class="sr-only">Toggle Dropdown</span>
              </button>
              <ul id="method-menu" class="dropdown-menu">
                <li><a id="method-validate" href="#" data-value="validate">Validate it!</a></li>
                <li><a id="method-dereference" href="#" data-value="dereference">Dereference it!</a></li>
                <li><a id="method-bundle" href="#" data-value="bundle">Bundle it!</a></li>
                <li><a id="method-parse" href="#" data-value="parse">Parse it!</a></li>
                <li><a id="method-resolve" href="#" data-value="resolve">Resolve it!</a></li>
              </ul>
            </div>
          </div>
        </div>

        <ul class="nav nav-tabs" role="tablist">
          <li class="active" role="presentation">
            <a id="url-tab" href="#url-pane" role="tab" aria-controls="url-pane" data-toggle="tab">Validate a URL</a>
          </li>
          <li role="presentation">
            <a id="text-tab" href="#text-pane" role="tab" aria-controls="text-pane" data-toggle="tab">Validate Text</a>
          </li>
        </ul>
        <div class="tab-content">
          <div id="url-pane" class="tab-pane active" role="tabpanel">
            <div class="form-group">
              <label for="url">Enter the URL of your Swagger/OpenAPI definition</label>
              <div class="col-xs-12 col-sm-offset-2 col-sm-8">
                <input type="url" id="url" name="url" class="form-control" placeholder="http://your-site.com/swagger.yaml">
                <p id="url-sample">
                  or <a id="url-sample-link" href="#">use a sample</a> instead
                </p>
              </div>
            </div>
            <a id="bookmark" href="#">bookmark these settings</a>
          </div>
          <div id="text-pane" class="tab-pane" role="tabpanel">
            <pre id="text-box" class="editor"></pre>
            <p id="text-sample">
              Paste your API definition, or <a id="text-sample-link" href="#">use a sample</a> instead
            </p>
          </div>
        </div>
      </form>

      <div id="results" class="hidden">
        <button id="clear" type="button" class="close" title="Discard these results"><span aria-hidden="true">&times;</span></button>
        <ul class="nav nav-tabs" role="tablist"></ul>
        <div class="tab-content"></div>
      </div>
    </div>

    <footer>
      <p>
        <a href="{{ site.github.repository_url }}">{{ site.github.repository_name }}</a> is maintained by
        <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.
      </p>
    </footer>
  </div>
</div>

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

<!-- Bootstrap -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<!-- ACE Editor -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/ace.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/theme-terminal.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/mode-yaml.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/mode-json.js"></script>

<!-- Polyfills for older browsers -->
<script src="js/polyfills/promise.js"></script>
<script src="js/polyfills/typedarray.js"></script>

<!-- Swagger Parser -->
<script src="js/bundle.min.js"></script>