Skip to content
GlassMarshmallow

Install

Use a package manager, a CDN or the source files to add GlassMarshmallow to your project.

View on GitHub
On this page

Not published yet. GlassMarshmallow v0.1 is still in development, so the npm package and the CDN links below don't work yet. They show how installing will work once it's released.

Package managers

Install the GlassMarshmallow CSS with your package manager of choice.

npm install glassmarshmallow

Using the CSS

Link the compiled file in your HTML, or import it from your own CSS.

<link rel="stylesheet" href="node_modules/glassmarshmallow/dist/css/glassmarshmallow.min.css">

If you only need some parts, import the source files one by one. tokens.css always goes first.

css
@import "glassmarshmallow/css/tokens.css";
@import "glassmarshmallow/css/base.css";
@import "glassmarshmallow/css/components.css";
@import "glassmarshmallow/css/backdrop.css";

Icons

The icons live in their own package, GlassMarshmallow Icons.

npm install glassmarshmallow-icons

Then load the stylesheet and use an icon with two classes. Icons take the color of the text around them.

html
<link rel="stylesheet" href="node_modules/glassmarshmallow-icons/font/glassmarshmallow-icons.css">

<i class="gmi gmi-moon" aria-hidden="true"></i>

CDN

Skip the install and load the compiled CSS from a CDN.

html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/glassmarshmallow.min.css">

Download

Download the source code from the repository on GitHub. The ready-to-use files are in dist/css/ and the source files in css/.

To build dist/ again after changing the source:

sh
npm run css

For AI tools & LLMs

GlassMarshmallow will come with files that help AI assistants write correct code with the framework:

  • llms.txt: a short map of the docs for language models.
  • AGENTS.md: the rules for agents working in the repository.
  • Skills: ready-made instructions for common tasks.

Read more in AI.