2016-03-25: v1.1 — Conditional expressions.
PowerCSS now supports arbitrary-depth conditional CSS and media
queries. See the
Conditional Expressions section of updated
documentation. We added 22 regression tests to
ensure quality and reliability.
The API is backwards compatible with 1.0 which we feel is
a major accomplishment given the requirements of
conditional expressions. The only exception is that the irregular
symbol names containing "bottom" have been made consistent.
_border_btm_ has been renamed to
_border_bottom_ as the former was needlessly different
from the CSS symbol.
The project is hosted on GitHub and is available as an
It can be installed using
npm install powercss. After
installation, if you'd like to run the regression tests, enter the
following into a Bash shell:
cd node_modules/powercss npm install npm test
This page is styled using PowerCSS. I know, dog-food much? Anyway, click at the top right to change the palette or cascade at any time. It looks good on a phone as well as a desktop. There are 5 examples discussed in the documentation. These include:
Traditional CSS is created well before it is used,
not when the application needs it. While preprocessors such as
Sass can help
reduce some of the tedium of creating styling variations, they complicate the
tool chain and can hinder design iterations.
PowerCSS is designed and optimized for run-time creation and application of CSS. It can be responsive to the user's environment to a level not possible with preprocessors. Even better, there is no additional compile step to hinder design iteration. Styling can be infinitely adjust based on almost any real-time data available to an application such as ambient temperature, device orientation, ambient light, GPS location, heart rate, or time of day. Static CSS can't compete with this flexibility.
PowerCSS has not only achieved its primary goal, but it is often better than static CSS in many other respects as well. It provides a simple and familiar API where experienced CSS authors can use their existing skills to be up and running in minutes. When compressed, a PowerCSS solution can download and render faster, and it can speed up some CSS operations by 10x or more. What's not to like?
2016-03-25: v1.0 — First production release. We have a strong set of regression tests and has been used in a number of production and production-intent projects with good results. Expect per-cascade double-buffered stylesheets in the 1.2.x release.
2016-03-20: v0.7.1 — Rewrote the rule-map
resolver. It now processes arbitrarily complex data
structures. This allows mixin maps with any nesting of
alternate-lists, concatenations, and symbol-lookups. The isolated code
is found in
2016-03-09: v0.6.6 — Fixed bugs found from
testing. Also added process events:
The event object provides the ID of the cascade
2016-03-07: v0.6.2 — Added automated regression tests. Production deployments underway.
2016-03-04: v0.5.20 — Added key benefits section .
2016-02-24: v0.5.16 — Completed 1.x API design. Also added double-buffering and theming demo to the home page.
2016-02-24: v0.5.0 — First beta announcment. PowerCss was nearly feature complete on this date and considered Beta. The API was overhauled, cutting the number of methods in half while adding many capabilities. Documentation and examples were expanded and updated. The cookbook section was added.