Playing With CodePen slideVars

**Playing With CodePen slideVars**

Super cool new CodePen feature alert. You’ve probably seen a bunch of “interactive” demos that let you change values on the fly from a UI panel embedded directly in the demo. Jhey’s demos come immediately to mind, like this one: CodePen Embed Fallback That’s a tool called TweakPane doing the work. There’s another one called Knobs by Yair Even Or that Adam Argyle often uses: CodePen Embed Fallback I’ve often faked it with either the Checkbox Hack or a sprinkle of JavaScript when I’m demoing a very specific concept: CodePen Embed Fallback OK, enough examples because CodePen has a homegrown tool of its own called slideVars. All you have to do is import it and call it in the JavaScript panel: import { slideVars } from "@codepen/slidevars"; slideVars.init(); You can import it into a project off CodePen if you’re so inclined...

---

**[devsupporter 해설]**

이 기사는 CSS-Tricks에서 제공하는 최신 개발 동향입니다. 관련 도구나 기술에 대해 더 알아보시려면 원본 링크를 참고하세요.