How to Use This Library

We're currently using unpkg to serve these files. There is no build step requirement, but remember this is experimental and will not work in all browsers.

There are 2 steps to using it:

1. HTML Include the worklet and custom properties file <script src='<packageName>'></script>
2. CSS Access the paint worklet with background: paint(<workletName>);

The URLs are in the following format: https://unpkg.com/extra.css/<packageName>.jsYou can grab any of the proper URLs by clicking on the links above for CDN Link. If you go to this link your URL bar, you will automatically be linked to the latest version number of the JS package which includes all of the registered custom properties and the worklet. This is a link to the latest version (i.e. https://unpkg.com/extra.css@1.1.0/<PackageName>.js), but if you always want the evergreen latest version, you can skip the version number. The Demo tab will open up an explanatory Codepen project with everything properly hooked up.

Here is an example of what your HTML and CSS could look like for the Cross Out example:

This is a WIP proof of concept for Houdini Paint Modules! I'd love to have you contribute your thoughts on Github.