EffCSS

EffCSS is a self-confident CSS-in-JS library based only on the browser APIs. Use the full power of JS and TS to create styles.

Some features

• zero-dependency,
• framework agnostic,
• selectors isolation and minification out of the box,
• flexible stylesheets types that can suggest available selectors (BEM and Atomic CSS compatible),
• compatible with any rendering (CSR, SSR, SSG).

Links

• Docs
• SourceCraft
• GitFlic
• GitVerse
• GitHub
• GitLab
• NPM

Devtools

• Mozilla Firefox
• zip for Chromium based browsers, that can be installed using chrome://extensions

Examples

• Vanilla TS
• React
• Svelte
• Vue
• Angular
• SolidJS
• Preact
• Qwik
• Lit
• React SSR
• Svelte SSR
• Vue SSR
• Astro SSG

Installation

Type in your terminal:

Quick start

Just call

in your code:

main.js

Each CSS stylesheet corresponds to a single

.

Stylesheet maker

is a JS function that should return object or string with style rules:

maker.ts

To use

just pass it to

cx

(creates classnames string) or

dx

(creates data attributes object) methods of

Style provider

:

App.tsx

That's all. Enjoy simplicity.