Corncob

Corncob Design Language

Corncob is a framework-neutral design language built with tokens, CSS, and plain JavaScript behavior.

Getting Started

Install

npm install @corncob/design-language

Include Styles

This contains the base styles for all the components and design tokens. You can also import individual component styles if you want to reduce the amount of CSS included in your project.

import '@corncob/design-language/style.css';

HTML version:

<link rel="stylesheet" href="./corncob-design-language.css" />

Include Scripts

You can also include the JavaScript file for any components that require behavior. This is optional and only needed for components that have interactive behavior.

import '@corncob/design-language';

HTML version:

<script type="module" src="/assets/corncob-design-language.esm.js"></script>

Use Markup

<button class="corn-button">Save</button>
<button class="corn-button corn-button--secondary">Cancel</button>