Skip to content
forked from lowlighter/matcha

🍡 Drop-in semantic styling library in pure CSS.

License

Notifications You must be signed in to change notification settings

dsojevic/matcha

Β 
Β 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

76 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🍡 matcha.css

🌊 See live on matcha.mizu.sh !

matcha.css is a pure CSS library designed to style HTML elements similarly to a default browser stylesheet, eliminating the need for users to manually patch their documents.

Ideal for fast prototyping, static HTML pages, Markdown-generated documents, and developers seeking to streamline their workflow without delving into CSS intricacies and want to make use of the full range of available HTML elements.

  • βœ… No build steps
  • βœ… No dependencies
  • βœ… No JavaScript
  • βœ… No configuration needed
  • βœ… No refactoring required
  • βœ… ~6kB gzipped (can be further reduced)

πŸ“Έ Screenshot examples

πŸ₯’ Why choose matcha.css?

🍜 Agnostic

Works seamlessly with any document and covers a broader range of HTML elements compared to similar libraries. It remains unobtrusive by leveraging CSS pseudo-elements and offers extensive browser support.

πŸ₯ Reversible

Simply include its <link rel="stylesheet"> to get started, and remove it whenever necessary without the need for document refactoring or cleanup.

🍑 Semantic

Adapts styling based on elements hierarchy, providing intuitive behaviors such as "implicit submenus" when nesting <menu> elements, required field indicator (*) when a <label> is paired with <input required>, etc.

🍱 Customizable

Brew your own build using our custom builder to select specific features and reduce the final build size according to your project's needs.

🍘 Open-source

Released under the MIT License, freely available at github.com/lowlighter/matcha.

πŸ“– Usage

To utilize matcha.css, just include the following line in the <head> section of your document. It's that simple!

<link rel="stylesheet" href="https://matcha.mizu.sh/matcha.css">

πŸ“œ License

MIT License
Copyright (c) 2024-present Simon Lecoq (lowlighter)

About

🍡 Drop-in semantic styling library in pure CSS.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 67.2%
  • CSS 25.0%
  • TypeScript 7.8%