JSPM

cobra-css

1.0.2
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 16
  • Score
    100M100P100Q68094F
  • License MIT

A utility-first CSS library inspired by Tailwind CSS for fast UI development

Package Exports

  • cobra-css
  • cobra-css/dist/cobra-utilities.css

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (cobra-css) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Cobra CSS

A utility-first CSS library inspired by Tailwind CSS for rapid UI development.

Features

  • Modular utility classes for colors, spacing, typography, flexbox, grid, borders, and more.
  • Fully customizable: edit source CSS files and rebuild with a simple script.
  • Easy integration: include the combined CSS in your projects or install via npm.

Installation

Install via npm:

npm install cobra-css

text

Or include the CSS file directly if you host it yourself or via CDN:

``` Usage Import the CSS in your JavaScript:

text import 'cobra-css/dist/cobra-utilities.css'; Or include the CSS in your HTML:

text

Use utility classes in your HTML elements:

text

Welcome to Cobra CSS!

Development To customize or extend Cobra CSS:

Edit CSS source files in the src/ folder.

Build the updated CSS with:

text npm run build Repository Find source code, report issues, or contribute here:

https://github.com/seneargroup/cobra-css

/////////////////////////////////////////////////////////////////////////////////////////////

How to Use Cobra CSS

  1. Installation via npm Users install in their project by running:

bash npm install cobra-css

  1. Include in JavaScript or front-end build Import the CSS inside your JavaScript entry point or wherever you bundle your styles:

js import 'cobra-css/dist/cobra-utilities.css';

  1. Include in plain HTML projects Add a tag in your HTML referencing the CSS inside node_modules or from your own hosted copy:
Or from a CDN if you host or use jsDelivr (after publishing):
  1. Use Cobra utility classes in your markup You can then build your UI by adding utility classes:

Welcome to Cobra CSS!

  1. Customize or extend Cobra CSS

Additional tips for users: Combine multiple utility classes to achieve complex layouts and styles.

Explore the dist/cobra-utilities.css file to see all available utility classes.

For advanced customization, fork the repo, edit src CSS files, and build your own version.

License This project is licensed under the MIT License - see the LICENSE file for details.

MIT License

Copyright (c) 2025 cobra-css (payelancer Softwares Pvt.Ltd)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.