CINXE.COM
Bourbon - A Lightweight Sass Tool Set
<!DOCTYPE html> <html lang=en> <head> <meta charset=utf-8> <meta http-equiv=x-ua-compatible content="ie=edge"> <meta name=viewport content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name=description content="Bourbon is a library of pure Sass mixins and functions that are designed to make you a more efficient style sheet author. "> <title>Bourbon - A Lightweight Sass Tool Set</title> <link href="/assets/stylesheets/main-d8f9049c.css" rel=stylesheet /> </head> <body class="c-site-frame u-margin-top-medium"> <header class=c-site-frame__nav> <div class="p-grid-container c-flash-message"> <strong>This project is no longer maintained.</strong> <a href="https://thoughtbot.com/blog/you-might-not-need-bourbon">Read our guide on replacing this with native CSS →</a> </div> <nav class=c-site-nav role=navigation> <div class=p-grid-container> <div class="p-grid__column--12 u-flex u-flex-align-items-center"> <a href="/" class=u-line-height-zero> <svg class=c-site-nav__logo-svg width=151 height=24 xmlns="http://www.w3.org/2000/svg"> <title>Bourbon</title> <path d="M8.4124 13.5305v6.1886h3.8257c3.5256 0 5.0259-1.2002 5.0259-3.113 0-1.913-1.5003-3.0756-5.026-3.0756H8.4125zm3.3756-3.1506c3.188 0 4.5758-1.0502 4.5758-2.7755 0-1.6503-1.3877-2.663-4.5758-2.663H8.4124v5.4385h3.3756zm4.8759 1.3127c2.2504.1876 4.3508 2.813 4.3508 4.9134 0 4.2383-3.038 6.4137-8.7016 6.4137H.836V19.719h2.738l1.3502-1.3503V6.2916L3.574 4.9414H.836V1.6408h11.0645c5.3635 0 8.214 2.1379 8.214 5.9636 0 1.7628-1.0502 3.6006-3.4506 4.0882zm6.2943 3.3756c0-4.8008 3.9382-8.4765 9.1517-8.4765 5.2134 0 9.1516 3.6757 9.1516 8.4765 0 4.801-3.9382 8.4766-9.1516 8.4766-5.2135 0-9.1517-3.6757-9.1517-8.4766zm14.3651 0c0-2.9255-2.0629-5.0259-5.2134-5.0259-3.1506 0-5.2135 2.1004-5.2135 5.026 0 2.9255 2.0629 5.0258 5.2135 5.0258 3.1505 0 5.2134-2.1003 5.2134-5.0259zm16.5712-7.9514v3.3006h1.7253l1.3503 1.3502v4.9134c-1.2378 2.363-2.9256 3.5257-5.4385 3.5257-2.4755 0-3.0756-1.5378-3.0756-4.0883V7.1168h-6.4512v3.3006h1.7254l1.3502 1.3502v5.776c0 3.8633 2.813 6.0012 6.3012 6.0012 2.663 0 4.5383-1.5753 5.5885-2.813v2.2879h6.4511V19.719H61.696l-1.3502-1.3503V7.1168h-6.4512zm26.0673 5.476c0 1.8003 1.2377 2.5504 2.7755 2.5504 2.1378 0 3.2255-1.9503 3.2255-3.6381 0-2.2504-1.5377-4.9134-5.4384-4.9134-2.813 0-5.251 1.8378-7.3139 4.4633V7.1168h-7.1263v3.3006h2.4005l1.3502 1.3502v6.6012l-1.3502 1.3503h-2.4005v3.3006h14.4026V19.719h-5.926l-1.3503-1.3503v-3.413c2.9256-3.3757 4.9884-5.251 7.4264-5.251.8626 0 1.3877.1875 1.6878.45.1875.15.3.3001.375.4126-.1125-.0375-.3375-.075-.4875-.075-1.3128 0-2.2504.8627-2.2504 2.1004zm12.6602.7501v3.4506c1.3127 1.988 2.813 3.4132 5.476 3.4132 3.0005 0 4.7634-2.213 4.7634-5.1385 0-2.9255-1.7629-5.1384-4.7634-5.1384-2.663 0-4.1633 1.4253-5.476 3.4131zm0 9.6768h-5.776V19.719h1.8003l.6-.6001V3.9287l-.6-.6001h-1.9129V.028h5.8886v9.3767c.9377-1.1252 2.8505-2.813 5.8136-2.813 4.7258 0 8.214 3.7507 8.214 8.4765 0 4.7259-3.4882 8.4766-8.214 8.4766-2.963 0-4.876-1.6878-5.8136-2.813v2.2879zm16.486-7.9515c0-4.8008 3.9382-8.4765 9.1516-8.4765 5.2135 0 9.1517 3.6757 9.1517 8.4765 0 4.801-3.9382 8.4766-9.1517 8.4766-5.2134 0-9.1516-3.6757-9.1516-8.4766zm14.365 0c0-2.9255-2.0628-5.0259-5.2134-5.0259s-5.2134 2.1004-5.2134 5.026c0 2.9255 2.0628 5.0258 5.2134 5.0258s5.2135-2.1003 5.2135-5.0259zm12.3978-1.6128c1.2377-2.3629 2.9255-3.5256 5.4385-3.5256 2.8505 0 3.0755 2.2129 3.0755 4.0882v4.3508l-1.3502 1.3503h-1.7253v3.3006h9.5267V19.719h-1.7253l-1.3503-1.3503v-5.776c0-3.8632-2.888-6.0011-6.2636-6.0011-2.663 0-4.5758 1.5753-5.626 2.813v-2.288h-6.4512v3.3007h1.7253l1.3503 1.3502v6.6012l-1.3503 1.3503h-1.7253v3.3006h9.5267V19.719h-1.7253l-1.3502-1.3503v-4.9134z" fill-rule=evenodd /> </svg> </a> <a href="https://github.com/thoughtbot/bourbon#installation" class="c-site-nav__link u-margin-left-auto">Installation</a> <a href="/docs/latest/" class=c-site-nav__link>Documentation</a> <a href="https://github.com/thoughtbot/bourbon/blob/main/CHANGELOG.md" class=c-site-nav__link>Change Log</a> <a href="https://twitter.com/bourbonsass/" class="c-site-nav__link c-site-nav__link--icon u-line-height-zero"> <svg class=icon title=Twitter> <use xlink:href="/assets/images/icons-e9e3c3c0.svg#twitter"/> </svg> </a> <a href="https://stackoverflow.com/questions/tagged/bourbon/" class="c-site-nav__link c-site-nav__link--icon u-line-height-zero"> <svg class=icon title="Stack Overflow"> <use xlink:href="/assets/images/icons-e9e3c3c0.svg#stack-overflow"/> </svg> </a> <a href="https://github.com/thoughtbot/bourbon/" class="c-site-nav__link c-site-nav__link--icon u-line-height-zero"> <svg class=icon title=GitHub> <use xlink:href="/assets/images/icons-e9e3c3c0.svg#github"/> </svg> </a> </div> </div> </nav> </header> <main class=c-site-frame__body role=main> <header class=u-margin-top-x-large role=banner> <div class=p-grid-container> <div class=p-grid__column--12> <h1>Bourbon is a lightweight Sass tool set</h1> <p>Latest version: 7.3.0</p> <ul> <li>Dependency-free: Bourbon is pure Sass.</li> <li>Human-readable: We aim for clarity over brevity.</li> <li>Lightweight: Zero output post-install and has no visual opinion.</li> </ul> <a href="https://github.com/thoughtbot/bourbon#installation" class="c-button c-button--primary">Get Started</a> </div> </div> </header> </main> <div class=c-site-frame__footer> <footer class=c-site-footer role=contentinfo> <div class=p-grid-container> <div class=p-grid__column--12> <p> © 2011–2024 <a href="https://thoughtbot.com">thoughtbot, inc.</a> </p> <a href="https://thoughtbot.com/open-source-code-of-conduct">Code of Conduct</a> </div> </div> </footer> </div> <script src="/assets/javascripts/main-d0b42b96.js"></script> </body> </html>