VSN.js VSN.js
Docs Examples npm GitHub
Get started
Docs
Start Here
What is VSN Quick Start First Behavior
Essentials
Installation Behaviors & Selectors State & Scope Bindings Events Lifecycle Queries
Directives (Attributes)
vsn-bind vsn-on:* vsn-if vsn-show vsn-html vsn-get / vsn-target / vsn-swap vsn-each
CFS Language
Syntax reference Expressions Functions Destructure/spread Pipes (|>) Template literals
Modifiers & Flags
!important !debounce Event Modifiers
Runtime & Scope
Scope chain rules Root scope behavior State merge/specificity Error Handling
Integrations
SSR patterns htmx-style partials Build/bundler usage (ESM/CJS)
Plugins
sanitize-html microdata
Advanced
Performance & Caching Security & Sanitization Extending Debugging & Diagnostics
Reference
Full grammar CLI/API Browser support

!important

!important protects a declaration from being overridden by more specific selectors.

Example

behavior .card {
  theme: "light" !important;
}

behavior .card.primary {
  theme: "brand";
}

Even though .card.primary is more specific, theme stays "light".

When to avoid it

Use !important sparingly. It can make overrides harder to reason about.

On this page Example When to avoid it
Previous Template literals Next !debounce
VSN.js - Powered by pure vibes. © 2026 vsnjs.org