Skip to content
5th generation CSS-in-JS library
Branch: master
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.storybook docs: add animation docs Feb 25, 2018
build
demo fix: hoist correctly @Keyframe and @media Feb 28, 2018
docs fix typo in docs Nov 13, 2018
src test: add renderer SSR rule() test Mar 1, 2018
.gitignore chore: update ignore files Feb 15, 2018
.npmignore
.travis.yml
README.md docs: add link to nano-css Jul 14, 2018
package.json chore(deps): update dependency @types/node to v8.10.46 Apr 19, 2019
renovate.json chore: configure renovate.json Feb 8, 2018
tsconfig.json docs: add autocompletion GIF Feb 10, 2018

README.md

Consider using nano-css instead. It is smaller, tested and actively maintained.

libreact logo

freestyler

5th generation React styling library — it is lightning fast, lean, and with gazillion features.

        Yeah, straight from the top of my dome
            As I rock, rock, rock, rock, rock the microphone
                Yeah, straight from the top of my dome
                    As I rock, rock, rock, rock, rock the microphone...

feat.

Typing and autocompletion

CSS Templates

Reference

Installation

npm i freestyler --save

Usage

import {
    css,
    styled,
    rule,
    StyleSheet,
    Component,
    hoc,
    jsxstyle
} from 'freestyler';

import hyperstyle from 'freestyler/lib/react/hyperstyle';
import {styleit, Styleit} from 'freestyler/lib/react/styleit';

Decorate stateful components.

@css({
    border: '1px solid tomato',
})
class App extends Component {
    render () {
        return <div>Hello world!</div>;
    }
}

Or, create "styled" stateless components.

const Bordered = styled.div({
    border: '1px solid tomato',
});
const App = () =>
    <Bordered>Hello world!</Bordered>;

License

Unlicense — public domain.


Are you a freestyler?
You can’t perform that action at this time.