> ## Documentation Index
> Fetch the complete documentation index at: https://developer.fabric.inc/llms.txt
> Use this file to discover all available pages before exploring further.

# Welcome to the fabric Knowledge Base

> fabric’s API-first platform gives developers the control and flexibility to easily build from scratch or integrate with the existing stack, to compose the perfect commerce experiences.

export function openSearch() {
  document.getElementById('search-bar-entry').click();
}

<div className="bodyFull bg-background-light dark:bg-background-dark" style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2024/12/cta-background-unmasked-1.svg')"}}>
  <div className="bodyContainer bg-background-light dark:bg-background-dark">
    <div className="relative w-full flex items-center justify-center" style={{ height: '24rem', overflow: 'hidden' }}>
      <div id="background-div" class="absolute inset-0 bg-background-light dark:bg-background-dark -z-10" style={{height: "24rem", backgroundSize: "cover", backgroundPosition: "center"}} />

      <div style={{ position: 'absolute', textAlign: 'center', padding: '0 1rem', maxWidth: '100%', left: '50%', transform: 'translateX(-50%)' }}>
        <h1
          className="text-gray-800 dark:text-white mt-4 "
          style={{
        marginTop: '4rem',
        fontSize: '42px',
        fontWeight: 500,
        margin: '0',
        whiteSpace: 'nowrap',
        textAlign: 'center'
    }}
        >
          Welcome to fabric's Knowledge Base
        </h1>

        <p className="mt-4 text-gray-800 dark:text-white subtitle">Here you'll find API references, developer guides, UI navigation guides, and release notes.</p>

        <div className="flex items-center justify-center">
          <div className="flex items-center justify-center" style={{ width: '80%' }}>
            <button
              type="button"
              className="hidden w-full lg:flex items-center text-sm leading-6 box-full rounded-full py-2 pl-3 pr-3 shadow-sm text-gray-400 dark:text-white/50 bg-background-light dark:bg-background-dark dark:brightness-[1.1] dark:ring-1 dark:hover:brightness-[1.25] ring-1 ring-gray-400/20 hover:ring-gray-600/25 dark:ring-gray-600/30 dark:hover:ring-gray-500/30 focus:outline-primary"
              id="home-search-entry"
              style={{
      marginTop: '2rem',
      maxWidth: '100rem',
      width: '90%',
      margin: '2rem auto 0'
    }}
              onClick={openSearch}
            >
              <svg
                className="h-4 w-4 ml-1.5 flex-none bg-primary-light hover:bg-gray-600 dark:bg-white/50 dark:bg-gray-400 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',
      }}
              />

              <p className="dark:text-gray-400">What can we help you build?</p>
            </button>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div className="FullSolid bg-background-light dark:bg-background-dark">
    <div className="bodyContainer solid bg-background-light dark:bg-background-dark">
      <div className="spacer" />

      <div className="pink-boxes dark:bg-background-dark">
        <div className="three-col dark:bg-background-dark">
          <CardGroup cols={3}>
            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-orders@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Orders" href="/v3/orders-and-inventory/user-guides/orders/overview">
                Centralized source of order, inventory, and warehouse information.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-orders@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card className="bar" title="Inventory" href="/v3/orders-and-inventory/user-guides/inventory/overview">
                Receive and track inventory across networks and locations.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-inventory@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Fulfillment" href="/v3/orders-and-inventory/user-guides/orders/order-fulfillment-logic/order-fulfillment-logic">
                Build fulfillment rules sets to direct orders to different fulfillment locations.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-fulfillment@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Product Catalog" href="/v3/product-catalog/user-guides/product-catalog/overview">
                Centralized source for all products.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-product-catalog@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Dropship Retailers" href="/v3/dropship/dropship-retailers/overview">
                Launch, operate, and scale a curated assortment of products with unlimited dropship suppliers.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-dropship-retailers@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Dropship Suppliers" href="/v3/dropship/dropship-suppliers/overview">
                Launch, operate, and scale your product assortment across channels with your retailer partners.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-dropship-suppliers@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Cart & Checkout" href="v3/cart-and-checkout/api-reference/carts-v3/overview">
                Streamline cart management and checkout with multi-cart support, seamless transitions, and unified experiences.
              </Card>
            </div>

            <div style={{backgroundImage: "url('https://fabric.inc/wp-content/uploads/2025/02/fabric-knowledge-base-cart-checkout@2x.png')",backgroundSize: "cover",borderRadius: "16px"}}>
              <Card title="Offers" href="v3/offers/user-guides/offers/overview">
                Manage your pricing, promotions, and coupons in one place.
              </Card>
            </div>
          </CardGroup>
        </div>
      </div>

      <div className="spacer" />

      <div className="resource-boxes">
        <CardGroup cols={4}>
          <Card title="Product Releases" href="https://fabric.inc/type/product-releases" />

          <Card title="Blog" href="https://fabric.inc/blog" />

          <Card title="Collections" href="https://github.com/FabricCommerce/public-fabric-api-postman-collections" />

          <Card title="Demo" href="https://fabric.inc/demo-request" />
        </CardGroup>
      </div>

      <div className="spacer" />

      ***

      <div className="spacer" />

      <div className="footer">
        <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet" />

        <div class="footer-links col-lg-6 dark:bg-background-dark">
          <ul>
            <li><svg class="h-4 w-4 bg-primary dark:bg-primary-light fa-thin fa-list bg-background-light dark:bg-background-light" /> Check out our <a href="https://developer.fabric.inc/v3/release-notes/">Release Notes</a></li>
            <li><svg class="h-4 w-4 bg-primary dark:bg-primary-light fa-thin fa-headphones bg-background-light dark:bg-background-light" /> Questions? <a href="https://fabric.inc/contact-us">Contact Sales</a></li>
          </ul>
        </div>

        <div class="updated col-lg-6 dark:bg-background-dark" />
      </div>
    </div>
  </div>
</div>