Download Halfmoon to get the compiled CSS, or include it with a package manager.
Compiled CSS #
Halfmoon is an open-source, MIT-licensed, CSS framework. You can find everything on GitHub (opens in new tab), or click on the button below to download ready-to-use compiled CSS for Halfmoon, which includes the following:
halfmoon.css— compiled and minified
halfmoon.rtl.css— compiled and minified, for right-to-left pages (learn more)
- Core theme CSS files inside the
/css/coresfolder (learn more)
halfmoon.js (or anything similar). Instead we rely entirely on
bootstrap.bundle.js, which you can download from Bootstrap's website (opens in new tab). This means that you can replace
halfmoon.css on your website, and everything should work exactly as expected.
This also means that you can use any of the Bootstrap component libraries for popular JS frameworks such as React, Vue, Angular, Svelte, etc.
Starter template #
Here's a starter template to help you quickly get started with Halfmoon. You can replace the CDN links with locally available file paths if you want to.
<!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Starter template - Halfmoon</title> <!-- Halfmoon CSS --> <link href="https://firstname.lastname@example.org/css/halfmoon.min.css" rel="stylesheet" integrity="sha256-SsJizWSIG9JT9Qxbiy8xnYJfjCAkhEQ0hihxRn7jt2M=" crossorigin="anonymous"> </head> <body> <h1>Hello, world!</h1> <!-- Option 1: Bootstrap JS bundle with Popper --> <script src="https://email@example.com/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> <!-- Option 2: Separate Popper and Bootstrap JS <script src="https://cdn.jsdelivr.net/npm/@firstname.lastname@example.org/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script> <script src="https://email@example.com/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script> --> </body> </html>
Package managers #
Pull Halfmoon into your projects with some of the most popular package managers.
Package managers npm #
Use Halfmoon in your Node.js powered apps with the npm package (opens in new tab):
# Install Halfmoon with npm npm i firstname.lastname@example.org
Once the package has been installed, you can simply import the CSS file:
// Import Halfmoon CSS import "halfmoon/css/halfmoon.min.css";
Package managers yarn #
Use Halfmoon in your Node.js powered apps with the yarn package (opens in new tab):
# Install Halfmoon with yarn yarn add email@example.com
Help us grow
Our main goal is to make Halfmoon the go-to framework for building websites, dashboards and tools. If you believe in our mission, consider becoming a sponsor and help us grow.
You can email us directly if you have any queries. We are always happy to answer.
Subscribe for updates
We will notify you when the framework gets a substantial update. No spam ever.
Follow us on Twitter so that you can stay updated that way.