Inlet is a "plugin" for CodeMirror2+ which pops up an inline color picker and numeric slider whenever you click on a number, a Hex String (ex. "#0004ff"), RGB String (ex. "rgb(0, 4, 255)"), or HSL String (ex. "hsla(239, 100%, 50%, 1)").
See an example at http://michaelsboost.github.io/Inlet
This project is inspired by Bret Victor's talk "Inventing on Principle"
The the slider code is originally adapted from Gabriel Florit's Water project the predecesor for Livecoding.io
The JQuery MiniColors is used to provide the color picker and TinyColor translates between color spaces.
- JQuery
- CodeMirror ( >= 3.1 )
- Inlet.js
- Inlet.css
- lib/jqueryminicolors.css
Check out index.html to see how to put things together
The key bit of javascript code to kick things off is:
var editor = CodeMirror('#editor', ...)
Inlet(editor)
Enjoy!
You can show your appreciation by Donating via SquareCash and/or PayPal