tsand / Responsive Sketchpad
Licence: mit
A completely responsive, HTML5 canvas sketchpad for use on desktop and mobile browsers
Stars: ✭ 125
Programming Languages
javascript
184084 projects - #8 most used programming language
typescript
32286 projects
Labels
Projects that are alternatives of or similar to Responsive Sketchpad
Curtainsjs
curtains.js is a lightweight vanilla WebGL javascript library that turns HTML DOM elements into interactive textured planes.
Stars: ✭ 1,039 (+731.2%)
Mutual labels: canvas, responsive
Freeciv Web
Freeciv-web is an Open Source strategy game implemented in HTML5 and WebGL, which can be played online against other players, or in single player mode against AI opponents.
Stars: ✭ 1,626 (+1200.8%)
Mutual labels: canvas
Mp canvas drawer
🚀 微信小程序上canvas绘制图片助手,一个json就制作分享朋友圈图片
Stars: ✭ 1,611 (+1188.8%)
Mutual labels: canvas
React Flexa
Responsive React Flexbox (CSS Flexible Box Layout Module) grid system based heavily on the standard CSS API.
Stars: ✭ 120 (-4%)
Mutual labels: responsive
Mq Scss
Extremely powerful Sass media query mixin. Allows you to create almost any media query you can imagine.
Stars: ✭ 122 (-2.4%)
Mutual labels: responsive
Canvas2video
Convert dynamic canvas to video, support merge audio
Stars: ✭ 117 (-6.4%)
Mutual labels: canvas
React Media Match
React made responsible - media queries backed by state machinery
Stars: ✭ 121 (-3.2%)
Mutual labels: responsive
Container Query
A PostCSS plugin and Javascript runtime combination, which allows you to write container queries in your CSS the same way you would write media queries.
Stars: ✭ 119 (-4.8%)
Mutual labels: responsive
Quickmenu
The new era of mobile navigation for the web, we're out of hamburgers.
Stars: ✭ 119 (-4.8%)
Mutual labels: responsive
Xsound
Web Audio API Library for Synthesizer, Effects, Visualization, Multi-Track Recording, Audio Streaming, Visual Audio Sprite ...
Stars: ✭ 123 (-1.6%)
Mutual labels: canvas
Canvas grab
🌐 One-click script to synchronize files from Canvas LMS.
Stars: ✭ 118 (-5.6%)
Mutual labels: canvas
Bubbly Bg
Beautiful bubbly backgrounds in less than 1kB (750 bytes gzipped)
Stars: ✭ 1,554 (+1143.2%)
Mutual labels: canvas
Kirby Imageset
A flexible, responsive image component for Kirby 2, featuring lazy-loading, fancy placeholders and much more.
Stars: ✭ 122 (-2.4%)
Mutual labels: responsive
G2
📊 A highly interactive data-driven visualization grammar for statistical charts.
Stars: ✭ 11,020 (+8716%)
Mutual labels: canvas
Terminal Canvas
Manipulate the cursor in your terminal via high-performant, low-level, canvas-like API
Stars: ✭ 125 (+0%)
Mutual labels: canvas
Responsive-Sketchpad
A completely responsive, HTML5 canvas sketchpad for use on desktop and mobile browsers with no dependencies.
Installation
npm install responsive-sketchpad
Example Usage
<!-- index.html -->
<html>
<head>
<script src="script.js" async></script>
</head>
<body>
<div id="sketchpad"></div>
</body>
<!-- Can also include global bindings if not using JS modules -->
<!-- <script src="sketchpad.js"></script> -->
</html>
// script.js
var Sketchpad = require('responsive-sketchpad');
// Initialize Sketchpad
var el = document.getElementById('sketchpad');
var pad = new Sketchpad(el, {
line: {
color: '#f44335',
size: 5
}
});
// Set line color
pad.setLineColor('#f44336');
// Set line size
pad.setLineSize(10);
// Undo
pad.undo();
// Redo
pad.redo();
// Clear canvas
pad.clear();
// Resize canvas
pad.resize(100);
// Make read only
pad.setReadOnly(true);
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].