roughen
v1.0.1
Published
API, GUI and CLI to roughjs your SVG's client or server side
Downloads
3
Maintainers
Readme
###Give all your svg's a cute hand-drawn feel.
Works server and client side. Accepts raw html files and DOM elements.
####Usage
const svg = document.querySelector('#svg');
const raw = `
<!DOCTYPE html>
<html>
<body>
<svg viewBox="0 0 10 10">
<rect width="3" height="5" />
</svg>
</body>
</html>
`
const options = {
roughness: 5,
fillStyle: 'dots'
}
const lambda = (node, context) => {
if (node.tagName === 'rect') {
return { stroke: 'blue', }
} else if (context.fill === 'pink') {
return false
}
}
roughen(raw, options) // => string
roughen(svg, lambda) // => Element
API:
type Context = { fill?: string, stroke?: string, strokeWidth?: number }
type Options = RoughOptions | (node: Element, ctx: Context) => RoughOptions | boolean
type Input = string | Element
declare function roughen(node: Input, options?: Options) => Input
This library is using the awesome roughjs