210 Repositories
JavaScript canvas-element Libraries
HTML Canvas game for Vivatech Gamejam of March 2022.
Viva Tech Gamejam A HTML Canvas game made in 2 days for the Vivatech Gamejam of March 22. Requirements Nodejs and Yarn. If you're on MacOS and have Ho
A small npm package that generates pretty identicons from string input.
HashprintJS HashprintJS is a small npm package written in TypeScript that generates customizable identicons. Provide a username, wallet address, IP ad
📜 A tiny custom element for all your scrollytelling needs!
scroll-scene element A tiny custom element for all your scrollytelling needs! The successor to @newswire/scroller. Key features 🐜 Less than 700 byt
A simple element template chooser for properties-panel = 1
A simple element template chooser for properties-panel = 1
GreetHub - Dynamic greeting for your readme profile 😍😍
GreetHub - Dynamic greeting for your readme profile 😍😍
Create sticky element in flexbox sidebars. it can use in Vanilla JS and frameworks like Vue and React
js sticky side simple sticky side with js that can use in frameworks like vue and react. notes it can be used just in flexbox grids. target element sh
Kunlun architecture element generation based on Angular schematics 🎬
A fullstack(NestJS、React) framework for building efficient and scalable applications. Description The Kunlun CLI is a command-line interface tool that
el-table awlays show horizontal-scroller on bottom
el-table awlays show horizontal-scroller on bottom
A suite of utilities to add more features to the details element
A suite of utilities to add more features to the details element
A-Frame Element is a simple library for building fast, lightweight web components for 3D development
aframe-element is a library inspired from the very nice library Polymer lit to map A-Frame AR / VR / 3D elements on typescript classes like Angular/React/Lit.
Vanilla JS browser game
Vanilla JS Game - Amazing Spacecraft 🚀 Online Demo: https://spacecraft.vercel.app/ a spacecraft that has to survive a journey through space ⌨ Shortcu
I forgot about el.outerHTML so I made this, it takes a DOM element and returns its html as string
htmlToString Convert html/DOM element to string Works with rendered and virtual DOM Installation npm install htmltostring Or using CDN script src="ht
vite+vue3.2+setup+elementPlus+eslint+js+stylelint
前期准备工作,npm包和vscode配置 !!!很重要,关乎整个Vue3开发阶段的代码提示 Volar使用 使用Vue3开发需要禁用vscode插件Vetur 然后安装 Volar(Vue Language Features),这样Vue3代码提示即使是使用js开发也非常友好 如果volar没有任何
HTML5 CSS3 vanilla js QR code generator with download options
QR Code Generator HTML5 CSS3 vanilla js QR code generator with download options Additional description about the project and its features. Built With
✂ Multiple scenes, one canvas! WebGL Scissoring implementation for React Three Fiber.
react-three-scissor Multiple scenes, one canvas! WebGL Scissoring implementation for React Three Fiber. scissor lets you render an infinite number of
A Google Chrome extension that automatically fills in the "CAPTCHA" form element for IISER Pune's SAM portal (Academic ERP) login form
A Google Chrome extension that automatically fills in the "CAPTCHA" form element for IISER Pune's SAM portal (Academic ERP) login form.
Lightweight, interactive planning tool that visualizes a series of tasks using an HTML canvas
Planner Lightweight, interactive planning tool that visualizes a series of tasks using an HTML canvas. Try it yourself at plannerjs.dev Plans created
lightweight (~5kb) code editor custom element with syntax highlighting
code-edit lightweight (~5kb) code editor custom element with syntax highlighting 🔧 Install · 🧩 Example · 📜 API docs · 🔥 Releases · 💪🏼 Contribute
Element for Angular
Element for Angular Catalog Documentation Getting Started Contribution Support LICENSE Documentation element-angular Getting Started Install: # instal
Lightweight web components library built with LitElement.
Aybolit Aybolit is a lightweight, standards-based, framework agnostic UI components library built with LitElement. Aybolit is a fictional character fr
Create DOM element and bind observables on it.
rx-domh Create DOM element and bind observables on it. Inspired by Binding.scala and react-flyd, I made this. Just a simple todo example: /** @jsx h *
Fast & Robust Front-End Micro-framework based on modern standards
Chat on gitter Hello slim.js - your declarative web components library import { Slim } from 'slim-js'; import { tag, template } from 'slim-js/decorato
a video player framework aims to bring wonderful experience on browser
Chimee English | 中文 Introduction Chimee is a web video player created by the Qiwoo Team. It's based on the web video element. It supports multiple med
Inspiration for revealing content by morphing the action element.
Morphing Buttons Concept Inspiration for revealing content by morphing the action element. Article on Codrops Demo Integrate or build upon it for free
Bursting particle effect buttons for React 🎉
react-particle-effect-button (demo) Bursting particle effect buttons for React. This library is a React port of an awesome Codrops Article by Luis Man
JavaScript library for object-based canvas drawing
oCanvas - Object-based canvas drawing oCanvas makes canvas development easier to understand and do, by creating a bridge between the native pixel draw
curtains.js is a lightweight vanilla WebGL javascript library that turns HTML DOM elements into interactive textured planes.
What is it ? Shaders are the new front-end web developpment big thing, with the ability to create very powerful 3D interactions and animations. A lot
A custom element for rendering stylable (light DOM) Markdown
Motivation There are many web components these days to render Markdown to HTML. Here are a few: zero-md marked-element …and I’m sure many others H
Toggle the state of a UI element to easily create components e.g. collapse, accordion, tabs, dropdown, dialog/modal.
Tiny UI Toggle Toggle the state of a UI element to easily create components e.g. collapse, accordion, tabs, dropdown, dialog/modal. Demo and documenta
🍞📊 Beautiful chart for data visualization.
🍞 📈 Spread your data on TOAST UI Chart. TOAST UI Chart is Beautiful Statistical Data Visualization library. 📦 Packages The functionality of TOAST U
🍞🎨 Full-featured photo image editor using canvas. It is really easy, and it comes with great filters.
Full featured image editor using HTML5 Canvas. It's easy to use and provides powerful filters. 📦 Packages toast-ui.image-editor - Plain JavaScript co
Scroll-stash - A JavaScript plugin to help preserve an element's scroll position.
scroll-stash A JavaScript plugin to help preserve an element's scroll position. CodePen Example Installation npm install scroll-stash JavaScript Impo
Slide-element - A ~700 byte Promise-based library for animating elements with dynamic heights open & closed. Basically, a modern variant of jQuery's slideUp(), slideDown(), and slideToggle().
slide-element A tiny, accessible, Promise-based, jQuery-reminiscent library for sliding elements with dynamic heights open & closed. To see it in acti
Diagram-maker - A library to display an interactive editor for any graph-like data.
Diagram Maker Diagram Maker is a library to display an interactive editor for any graph-like data. Following is a screenshot from one of the consumers
A simple project to refresh on the usage of js canvas and getContext('2d') to create four interactive squares on the canvas when hovered changes color.
A simple project to refresh on the usage of js canvas and getContext('2d') to create four interactive squares on the canvas when hovered changes color. Can also be clicked to work on mobile devices.
Cubo 3d com Javascript Canvas API.
Projection engine Motor gráfico escrito em javascript "from scratch". Ambiente de teste. Esse projeto não faz uso algum de NENHUMA API para renderizaç
🎮 Excalibur is a free game engine written in TypeScript for making 2D games in HTML5 canvas
🎮 An easy to use 2D HTML5 game engine written in TypeScript
An HTML5/Canvas implementation of 8-bit color cycling
Overview Here is the JavaScript and C++ source code to my color cycling engine, written in 2010. I am releasing it under the LGPL v3.0. The package co
基于react实现的滑动验证码组件
Hello react-slider-vertify! react-slider-vertify 是一款前端实现的滑动验证码组件, 我们可以通过它轻松的控制验证的整个生命周期(刷新时, 验证成功时, 验证失败时的回调), 并拥有一定的配置化能力. doc react-slider-vertify G
I made countdown birthday and fireworks animation using HTML Canvas, CSS, JS. The fireworks animation gonna come out once the countdown is finished or in other words, "Birthday Time".
Countdown-Birthday-Fireworks-Animation I made countdown birthday and fireworks animation using HTML Canvas, CSS, JS. The fireworks animation gonna com
A Custom Element for an analog clock.
analog-clock A Custom Element for an analog clock. Attributes mode (string): stopwatch or clock. size (number): Width and height in pixel. marks (nu
Detect when an element is becoming visible or hidden on the page.
React Visibility Detect when an element is becoming visible or hidden on the page. Installation npm install reactjs-visibility ⚠️ This plugin uses the
基于vue3.0-ts-Element集成的简洁/实用后台模板!《带预览地址》vue-admin;vue+admin;vue-element;vue+element;vue后台管理;vue3.0-admin;vue3.0-element。
一、基于vue3.0+ts+Element通用后台admin模板 二、在线预览地址:http://admin.yknba.cn/ 三、下载使用: 1、克隆代码 通过git将代码克隆到本地;或者使用下载安装包模式进行下载。 2、进入目录 进入项目的根目录:vue3.0-ts-admin 3、安装依
JAVASCRIPT library with which you can easily draw CANVAS HTML
easycanvas Quick start Documentation: gaidadei.ru/easycanvas Download: gaidadei.ru/easycanvas/easyc.zip Buy premium: gaidadei.ru/easycanvas/premium (A
use element-ui with some config
confism-element write HTML with javascript in vue install npm install confism-element -S U can register confism-element component in main.js // main.j
egg.js(jwt) + mysql(sequelize) + redis + docker + docker-compose + nginx + vue + element-ui 全栈获取省市区数据(统计局数据)【工具】项目,实现在docker环境中一键部署
Egg-spider Preview 线上预览地址 (https://ronaldoxzb.com/) admin admin Project description [后端]egg.js(jwt) + mysql(sequelize) + redis + docker + docker-compo
🎉 基于 vite 2.0 + vue 3.0 + vue-router 4.0 + vuex 4.0 + element-plus 的后台管理系统vue3-element-admin
vue3-element-admin 🎉 基于 Vite 2.0 + Vue3.0 + Vue-Router 4.0 + Vuex 4.0 + element-plus 的后台管理系统 简介 vue3-element-admin 是一个后台前端解决方案,它基于 vue3 和 element-plu
🎉🎉使用Vite + Vue3 + TypeScript + Element-plus + Mock开发的后台管理系统🎉🎉
Vite-Vue-Admin 介绍 Cli 配置 vue3.X vuex@4 vue-router@4 vite@2 typescript mock 内置 element-plus 二开封装 upload-file (文件上传,支持指定文件格式,文件大小) powerful-table (多功能表格
C7 is a canvas-based UI toolkit.
C7 C7 is a canvas-based UI toolkit. 中文版 Introduction C7 re-implements the key technology of modern front-end development based on HTML canvas (witho
Canvas
Installation $ npm install knights-canvas Example GoodBye const ling = require("knights-canvas"), const fs = require('fs'); const image = await new
Apache ECharts is a powerful, interactive charting and data visualization library for browser
Apache ECharts Apache ECharts is a free, powerful charting and visualization library offering an easy way of adding intuitive, interactive, and highly
A lightweight 3D game engine for the web.
A lightweight 3D game engine for the web. Built with three.js and cannon-es.
Cross-platform project template using Electron and Angular with the Phaser game engine. Project has Flexbox integrated for easy and responsive organization of components around the Phaser canvas.
Coher3nTS Project This is an Angular project template with Phaser nested inside, set up to run with Electron. Cross-Platform & Responsive The template
🔮 CSS loading animations made by single element.
Three Dots The project is a set of CSS loading animations created with three dots which made by just single element. I think the project can not only
The incredible effect of rain of letters in the style of the Matrix trilogy.
O Efeito Matrix O incrível efeito da chuva de letras no estilo da trilogia Matrix. "Cedo ou tarde, você vai aprender, assim como eu aprendi, que exist
⌨️ A tiny library for creating a typing effect on specified text element.
⌨️ TinyTyper - a tiny library for creating a typing effect on specified text element. Demo Size (It's really tiny) Minimized: 2.9KB Gziped: 1.1KB Inst
Add a retro/vintage effect to images using the HTML5 canvas element
vintageJS Add a retro/vintage effect to images using the HTML5 canvas element. Installation $ npm install vintagejs How to use vintagejs is a functio
magneticHover lets you trigger hover effect on the element when the cursor is near it, but not over it yet
magneticHover magneticHover lets you trigger hover effect on the element when the cursor is near it, but not over it yet. Examples https://codesandbox
Warp drive is a lightweight jQuery plugin that helps you create a cool, interactive, configurable, HTML5 canvas based warp drive/starfield effect.
Warp drive jQuery plugin (jquery-warpdrive-plugin) Preview Description Warp drive is a lightweight jQuery plugin that helps you create a cool, interac
Lightweight, High Performance Particles in Canvas
Sparticles https://sparticlesjs.dev Lightweight, High Performance Particles in Canvas. For those occasions when you 👏 just 👏 gotta 👏 have 👏 sparkl
Pixel based heatmap with html5 canvas.
heatcanvas Note that this project is no longer active maintained. Please let me know(file an issue or send me email) if you are interested in taking o
jQuery Timer: Start/Stop/Resume/Remove pretty timer inside any HTML element.
jQuery Timer plugin Lightweight, well tested jQuery pretty timer plugin Start, Pause, Resume and Remove a timer inside any HTML element. Get notified
Slidebars is a jQuery Framework for Off-Canvas Menus and Sidebars into your website or web app.
Slidebars Slidebars is a jQuery Framework for Off-Canvas Menus and Sidebars into your website or web app. Version 2.0 is a complete rewrite which feat
The best javascript plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp.
mmenu.js The best javascript plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp. It is very customiz
Backstretch is a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element. The image will stretch to fit the page/element, and will automatically resize as the window/element size changes.
Note: This repo is currently looking for maintainers: https://github.com/jquery-backstretch/jquery-backstretch/issues/464 Backstretch Backstretch is a
Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser
Fabric.js Fabric.js is a framework that makes it easy to work with HTML5 canvas element. It is an interactive object model on top of canvas element. I
Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source.
English| 简体中文 Introduction 🚀 Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source. Links
Clean up user-submitted HTML, preserving whitelisted elements and whitelisted attributes on a per-element basis. Built on htmlparser2 for speed and tolerance
sanitize-html sanitize-html provides a simple HTML sanitizer with a clear API. sanitize-html is tolerant. It is well suited for cleaning up HTML fragm
:flashlight: Set a spotlight focus on DOM element adding a overlay layer to the rest of the page
Focusable An awesome and lightweight library for performing spotlight in your DOM elements, setting an animated overlay to the rest of the page. You c
🎚 HTML5 input range slider element polyfill
rangeslider.js Simple, small and fast jQuery polyfill for the HTML5 input type="range" slider element. Check out the examples. Touchscreen friendly
Add live paragraph-, word- and character-counting to an HTML element.
Countable Countable is a JavaScript function to add live paragraph-, word- and character-counting to an HTML element. Countable is a zero-dependency l
The best javascript plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp.
mmenu.js The best javascript plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp. It is very customiz
Web typography at its finest: font-size and line-height based on element width.
FlowType.JS Responsive web typography at its finest: font-size and line-height based on element width. Check out the demo site. What does FlowType.JS
:woman: Library for image processing
Lena.js Tiny library for image processing. Install via NPM npm install lena.js --save Install via yarn yarn add lena.js Run demo yarn demo Demo htt
jQuery PopBox UI Element
jQuery PopBox jQuery PopBox is a simple balloon UI element inspired by 37Signals Highrise CRM. See it in action here: http://gristmill.github.com/jque
Everything you wish the HTML select element could do, wrapped up into a lightweight, extensible Vue component.
vue-select Everything you wish the HTML select element could do, wrapped up into a lightweight, zero dependency, extensible Vue component. Vue Selec
:fire::fire::fire: 强大的动态表单生成器|form-create is a form generation component that can generate dynamic rendering, data collection, verification and submission functions through JSON.
form-create form-create is a form generation component that can generate dynamic rendering, data collection, verification and submission functions thr
Everything you wish the HTML select element could do, wrapped up into a lightweight, extensible Vue component.
vue-select Everything you wish the HTML select element could do, wrapped up into a lightweight, zero dependency, extensible Vue component. Vue Selec
🎉 A Vue.js 3.0 UI Library made by Element team
Element Plus - A Vue.js 3.0 UI library 💪 Vue 3.0 Composition API 🔥 Written in TypeScript Status: Beta This project is still under heavy development.
A Vue.js 2.0 UI Toolkit for Web
A Vue.js 2.0 UI Toolkit for Web. Element will stay with Vue 2.x For Vue 3.0, we recommend using Element Plus from the same team Links Homepage and doc
:tada: A magical vue admin https://panjiachen.github.io/vue-element-admin
English | 简体中文 | 日本語 | Spanish SPONSORED BY 活动服务销售平台 客户消息直达工作群 Introduction vue-element-admin is a production-ready front-end solution for admin inter
🦍• [Work in Progress] React Renderer to build UI interfaces using canvas/WebGL
React Ape React Ape is a react renderer to build UI interfaces using canvas/WebGL. React Ape was built to be an optional React-TV renderer. It's mainl
React + Canvas = Love. JavaScript library for drawing complex canvas graphics using React.
React Konva React Konva is a JavaScript library for drawing complex canvas graphics using React. It provides declarative and reactive bindings to the
🍞🎨 Full-featured photo image editor using canvas. It is really easy, and it comes with great filters.
Full featured image editor using HTML5 Canvas. It's easy to use and provides powerful filters. Packages toast-ui.image-editor - Plain JavaScript compo
A library for visualization and creative-coding
Pts Pts is a typescript/javascript library for visualization and creative-coding. Get started at ptsjs.org. Please give it a try, file issues, and sen
A cross platform high-performance graphics system.
spritejs.org Spritejs is a cross platform high-performance graphics system, which can render graphics on web, node, desktop applications and mini-prog
Konva.js is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.
Konva Konva is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching,
📱📈An elegant, interactive and flexible charting library for mobile.
中文 README F2 is born for mobile, developed for developers as well as designers. It is Html5 Canvas-based, and is also compatible with Node.js, Weex an
Flat, round, designer-friendly pseudo-3D engine for canvas & SVG
Zdog Round, flat, designer-friendly pseudo-3D engine View complete documentation and live demos at zzz.dog. Install Download zdog.dist.min.js minified
Create graphics with a hand-drawn, sketchy, appearance
Rough.js Rough.js is a small (9 kB) graphics library that lets you draw in a sketchy, hand-drawn-like, style. The library defines primitives to draw
nivo provides a rich set of dataviz components, built on top of the awesome d3 and Reactjs libraries
nivo provides supercharged React components to easily build dataviz apps, it's built on top of d3. Several libraries already exist for React d3 integr
HTML5 Canvas Gauge. Tiny implementation of highly configurable gauge using pure JavaScript and HTML5 canvas. No dependencies. Suitable for IoT devices because of minimum code base.
HTML Canvas Gauges v2.1 Installation Documentation Add-Ons Special Thanks License This is tiny implementation of highly configurable gauge using pure
Interactive visualizations of time series using JavaScript and the HTML canvas tag
dygraphs JavaScript charting library The dygraphs JavaScript library produces interactive, zoomable charts of time series: Learn more about it at dygr
Financial lightweight charts built with HTML5 canvas
Lightweight Charts Demos | Documentation | Discord community TradingView Lightweight Charts are one of the smallest and fastest financial HTML5 charts
🍞📊 Beautiful chart for data visualization.
🍞 📈 Spread your data on TOAST UI Chart. TOAST UI Chart is Beautiful Statistical Data Visualization library. 📦 Packages The functionality of TOAST U
Powerful data visualization library based on G2 and React.
BizCharts New charting and visualization library has been released: http://bizcharts.net/products/bizCharts. More details about BizCharts Features Rea
a super simple, no-nonsense diagramming library written in react that just works
Introduction DEMO: http://projectstorm.cloud/react-diagrams DOCS (wip) https://projectstorm.gitbook.io/react-diagrams Docs are currently being worked
A renderer agnostic two-dimensional drawing api for the web.
Two.js A two-dimensional drawing api meant for modern browsers. It is renderer agnostic enabling the same api to render in multiple contexts: webgl, c
🔥 JavaScript Library for HTML5 canvas based heatmaps
heatmap.js Dynamic Heatmaps for the Web. How to get started The fastest way to get started is to install heatmap.js with bower. Just run the following