Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Prefix all rules from a css-file with a namespace selector.
CoffeeScript JavaScript CSS
branch: master
Failed to load latest commit information.
.gitignore Ignore temps include json in package.
index.js Add --no-directives option to skip @import, @face, etc.
package.json Version 0.0.8
parser.js Fix #2, new lines after comma on css selectors
parser.peg Fix #2, new lines after comma on css selectors


A tool for prefixing all rules from css-files with some selector.



npm install -g prefix-css


Well, sometimes you find that you'd like all rules from a css-file to apply but only while scoped under a specific selector.

ie, we all love using Twitter Bootstrap, imagine you could easily combine themes from BootSwatch on a single page by having each theme prefixed by a css selector.

Use case

suppose, for example that you're happily using the cyborg theme, but for some particular portion you want to apply the colors from the slate theme.

if you downloaded both themes as cyborg.min.css and slate.min.css, you could use prefix-css to namespace each theme under a css-selector:

$ prefix-css .cyborg cyborg.min.css > cyborg.prefixed.min.css
$ prefix-css .slate  slate.min.css  > slate.prefixed.min.css
<div class='cyborg'>
  <a href='#' class="btn btn-primary">A Cyborg Button</a>

<div class='slate'>
  <a href='#' class="btn btn-primary">An Slate Button</a>

see it in action


Bootswatchr Generate your own Bootstrap themes.

Bootswatch Some free Bootstrap themes.

Bootstrap Twitter Bootstrap

Something went wrong with that request. Please try again.