css-fns

CSS Functions

Straightforward helper functions to manipulate CSS in JS

setVar('--fav-color', 'rebeccapurple')

Installation

This package is available as a UMD, CommonJS and ES module build. This allows you to import the package as you see fit.

To get quickly get started, include the following script tag in your site's HTML file;

<script src="https://unpkg.com/css-fns"></script>

The cssFns variable is now globally available to use.

<script>
    const { getVar, setVar } = cssFns
 
    setVar('--fav-color', 'rebeccapurple')
 
    getVar('--fav-color')
    // 'rebeccapurple'
</script> 

Alternatively, you can install the package from npm, by running npm i css-fns and import it in your project;

import setVar, { getVar } from 'css-fns'
 
// or
 
const cssFns = require('css-fns')

Usage

This package exposes the following functions to easily manipulate/access CSS custom properties;

Function name	Default export	Parameter(s)	Return
setVar	true	variable (str), value (str/int)	none
getVar	false	variable (str)	property value (str)

Contributing

This project is open to and encourages contributions! Feel free to discuss any bug fixes/features in the issues. If you wish to work on this project:

1. Fork the project
2. Create your feature branch (git checkout -b new-feature-branch)
3. Commit your changes (git commit -am 'add new feature')
4. Push to the branch (git push origin new-feature-branch)
5. Submit a pull request!