214 Repositories
JavaScript canvas-liquid-effect Libraries
a temporary solution to revert to the old ui. the new ui was put into effect since april
Revert-YouTube-UI a temporary solution to revert to the old ui. the new ui was put into effect since april and is slowly rolling out to users. Feature
Cross-platform 2D editor that saves scenes to json
Webber's Map Editor 2D Load or create a new map Select your sprites' folder (recursively). Drag your sprites to the canvas to create instances. On the
Translate text in images using Vision API, Translation API and React with Canvas
manga-translator Manga translator app using Vision API, Translation API Rendered using React and canvas Installation Create a Google Cloud project, en
👾 Simple creating cards using canvas. Welcome, Rank, Info and so on.
⭐ discord-canvas-card Are you developing a bot using DiscordJS and you need beautiful images created using Canvas? You can create great welcome, goodb
This is my first website. It has helpful information, games, lots of pages & more.
Mitko.Vtori World This is my first website. It has helpful information, games, lots of pages & more. 🎞 Presentation & Introduction Here's link to my
A simple breakout game created using HTML, CSS and Javascript
BreakOut Game This game is created using HTML, CSS and Javascript Game Overview The game would consist of 3 lives in order to clear out all the blocks
An Exhibition Of Mathematical Beauty.
🪴 Fractal Garden 🪴 📐 An Exhibition Of Mathematical Beauty 📐 Fractals are awesome. They look beautiful and have intricate mathematical connections
A JavaScript plugin for creating a tickerboard effect. Plugin for React or vanilla JS.
ticker-board A JavaScript plugin for creating a tickerboard effect. See the Ticker Board page for more info. Importing it There are basically two ways
jQuery plugin for adding some effect to text
jquery.textroll.js DEMO and examples jQuery plugin for adding some effect to text : DEMO Usage Simple $(".someClass").textroll(); With Options
Snake game developed by Canvas & vanilla Js using OOP paradigm 🐍 🍎 🎮
Snake-Game 🐍 🍎 Snake game developed by Canvas & vanilla Js using OOP paradigm This project was an exercise for the canvas fullDemo Feature Eating fo
Pure JavaScript HTML5 Canvas Range Slider. No stylesheet needed. Simple, elegant and powerful. A quirky alternative to other sliders.
CanvasSlider CanvasSlider is a lightweight JavaScript range slider. Most of the range slider controls use Javascript and a stylesheet. This slider use
Small js library to animate some writing effect through a list of strings. It also supports settings for typo errors, to make it more human likely.
Write and Delete Small js library to animate some writing effect through a list of strings. It also supports settings for typo errors, to make it more
ezoom.js is a jQuery plugin for simple Image with zoom effect.
ezoom.js ezoom.js is a jQuery plugin for simple Image with zoom effect. This plugin in under development to support Next/Prev a gallery Images/SVG lat
A lib for text highlighting by using Canvas.
canvas-highlighter 基于 canvas 实现的文本划词高亮，与文本展示的结构完全解耦，不改变文本内容的 DOM 结构。 Installation npm install canvas-highlighter Usage 最简单的实现文本划词直接高亮 import CanvasHig
Have a code snippet, Create a code video
CodeVideo CodeVideo is a product that helps you to make code explanation videos. It's quick and easy, so anybody can create beautiful code videos with
Canvas-based JavaScript UI element implementing touch, keyboard, mouse and scroll wheel support.
pure-knob Initially a (circular) knob / dial control with mouse, wheel, touch and keyboard support, implemented in pure JavaScript. In addition, this
A simple and useful jquery plugin that allows you to create a Text Area Character Count Effect with limited warning.
jquery-character-counter A simple and useful jquery plugin that allows you to create a Text Area Character Count Effect with limited warning. #Demo Us
Fully controllable vanilla-js material design ripple effect generator.
Fully controllable vanilla-js material design ripple effect generator. This can be used with any JavaScript framework and/or any CSS framework. Demo I
A JavaScript library to shuffle the text content of a DOM element with an animated effect.
shuffle-letters.js A JavaScript library to shuffle the text content of a DOM element with an animated effect. NOTE: This library is a port to vanilla
Create tweet images
tweet-maker Create tweet images 2018'de javascripti kurcalarken yapmış olduğum bir proje. 2021'de eski kodlarıma bakarken buldum. 2021 yılı içerisinde
A lightweight JavaScript plugin for particle backgrounds.
ak-kaleidoscope ak-kaleidoscope is a lightweight JavaScript plugin for particle backgrounds. Demo See demo page. The examples code can be found in the
Your whole team, changing the world one stroke at a time.
Collanvas — Your whole team, changing the world one stroke at a time 🎨 With an online whiteboard, you can brainstorm 🧠 , draw art 🖌️ , and even pla
Audio visualizer library for javascript. Create dynamic animations that react to an audio file or audio stream.
Wave.js Audio visualizer library for javascript. Installation Install With CDN script src="https://cdn.jsdelivr.net/gh/foobar404/wave.js/dist/bundle.
Motionity is a free and open source animation editor in the web
Motionity The web-based motion graphics editor for everyone 📽 Motionity is a free and open source animation editor in the web. It's a mix of After Ef
jSide Menu is a well designed, simple and clean side navigation menu with dropdowns.
jQuery jSide Menu jSide Menu is a well designed, simple and clean side navigation menu with dropdowns. Browse: Live Demo & Using Guide Main Features F
A very simple JavaScript library written in vanilla js for scrambling text.
Scrambling Text A very simple JavaScript library written in vanilla js for scrambling text. Demo Page Table of Contents Installation Examples Basic Ex
Javascript library to generate an infinite stream or a burst of image based particles on HTML canvas.
spxparticles Stream or a burst of image particles on HTML canvas Simple Javascript library for generating an infinine stream or a burst of image based
Flexible, powerful and modern library for creating the running horizontal blocks effect, also known as ticker or the «marquee effect».
Cuberto Reeller Flexible, powerful and modern library for creating the running horizontal blocks effect, also known as ticker or the «marquee effect».
Little Alpine.js plugin to add a typewriter effect to any HTML element.
⌨️ Alpine Typewriter ⌨️ An Alpine.js plugin to add a typewriter effect to any HTML element. 🚀 Installation CDN Include the following script tag in
Enable Acrylic/Glass effect for your VS Code.
Visual Studio Code Extension - Vibrancy Continued The original extension has been deprecated, this version will continue to be supported and receive c
Snowfall effect written in pure JavaScript. No additional libraries, no dependencies. Works in every modern browser.
pureSnow.js Snow falling slowly on a winter night. Probably the most calming and peaceful snowfall effect written in pure JS/CSS. (No SCSS). Inspired
Javascript library to animate images on hover.
Ripple Hover Effect Javascript library to animate images on hover. If this project help you, don't forget to star it. Codepen demo by Essam Abed Demo
A lightweight, efficient and easy-to-use Canvas library for building some cool particle effects.
JParticles · 中文 | English 官网：jparticles.js.org 特效列表 粒子运动 波纹运动 波纹进度条 雪花飘落 线条动画 介绍 JParticles（JavaScript Particles 的缩写）是一款基于 Canvas 的不依赖于其他库的轻量级 JavaScr
Smooth scrolling effect (while using mouse wheel). No jQuery or other unnecessary stuff needed.
scrooth Smooth scrolling effect (while using mouse wheel). No jQuery or other unnecessary stuff needed. Why? I needed that, and I was unable to find p
A simple waves effect library
jquery-waves A simple & lightweight waves effect plugin Installation You can install jquery-waves plugin using npm or include directly files install u
The (extremely) lightweight alternative to the mmenu.js plugin for creating off-canvas mobile menus.
mmenu light The (extremely) lightweight alternative to the mmenu.js plugin for creating off-canvas mobile menus with the exact look and feel. Examples
An open-source Typing-effect Library, That enables potential users to add a typing effect to mere DOM Elements.
Typing Effect Library An open-source Typing-effect Library I created. That enables potential users to add a typing effect to mere DOM Elements. Tool P
Happy Birthday is a web-based party live background generated by CANVAS powered by JavaScript. This show a lot of random colorize particles in the background.
Happy BirthDay JS Happy Birthday is a web-based party live background generated by CANVAS powered by JavaScript. This show a lot of random colorize pa
A graphical web-based audio visualizer which reads music data using Pure JavaScript, and draws a graphical view in Canvas.
Audio Visualizer JS A graphical web-based audio visualizer which reads music data using Pure JavaScript, and draws a graphical view in Canvas. Demo: h
Simple fixed background parallax effect in vanilla js.
Simple Parallax Simple fixed background parallax effect in vanilla js. See demo on Codepen. JS Initialise the plugin. The first argument identifies th
The Easel Javascript library provides a full, hierarchical display list, a core interaction model, and helper classes to make working with the HTML5 Canvas element much easier.
EaselJS EaselJS is a library for building high-performance interactive 2D content in HTML5. It provides a feature-rich display list to allow you to ma
Framework for HTML5 Canvas oriented 2D video games
Canvas Engine http://canvasengine.net Description Framework to create video games in HTML5 Canvas Get Started Follow the steps below to start: Downloa
Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.
Phaser - HTML5 Game Framework Phaser is a fast, free, and fun open source HTML5 game framework that offers WebGL and Canvas rendering across desktop a
Demonstration of liquid effect on HTML Canvas using Matter.js and SVG Filters (Blur + Contrast)
Canvas Liquid Effect Demonstration of liquid (or gooey) effect on HTML Canvas using Matter.js and SVG Filters (feGaussianBlur and feColorMatrix). DEMO
📱📈An elegant, interactive and flexible charting library for mobile.
F2，一个专注于移动，开箱即用的可视化解决方案，完美支持 H5 环境同时兼容多种环境（node, 小程序，weex）。完备的图形语法理论，满足你的各种可视化需求。专业的移动设计指引为你带来最佳的移动端图表体验。英文 README 在此衷心感谢《The Grammar of Graphics》的作者
Simple yet flexible JavaScript charting for designers & developers
Simple yet flexible JavaScript charting for designers & developers Documentation All the links point to the new version 3 of the lib. Introduction Get
A lightweight graphic library providing 2d draw for Apache ECharts
ZRender A lightweight graphic library which provides 2d draw for Apache ECharts. Documentation https://ecomfe.github.io/zrender-doc/public/ License BS
JavaScript SVG parser and renderer on Canvas
canvg JavaScript SVG parser and renderer on Canvas. It takes the URL to the SVG file or the text of the SVG file, parses it in JavaScript and renders
Renders HTML into the browser's canvas
rasterizeHTML.js Renders HTML into the browser's canvas. See the API. Install $ npm install rasterizehtml Then include a script tag with node_modules
Generates an image from a DOM node using HTML5 canvas
DOM to Image What is it dom-to-image is a library which can turn arbitrary DOM node into a vector (SVG) or raster (PNG or JPEG) image, written in Java
Domvas implements the missing piece that connects the DOM and Canvas.
Domvas Overview Domvas implements the missing piece that connects the DOM and Canvas. It gives to the ability to take arbitrary DOM content and paint
Easily compose images together without messing around with canvas
merge-images Easily compose images together without messing around with canvas Canvas can be kind of a pain to work with sometimes, especially if you
Sticker.js - A Javascript library that allows you to create a Sticker Effect.
Sticker.js A Javascript library that allows you to create a Sticker Effect. No dependencies Works in most of major browsers that support CSS 3 (IE10+)
Attempt #2 at creating a game engine with Sciter.
JogoMaker Attempt #2 at creating a game engine with Sciter, with love and care. For Attempt #1, see this project, which was hastily thrown together as
📸 Generate image using HTML5 canvas and SVG
egami → image README | 中文文档 Generate image using HTML5 canvas and SVG Fork from html-to-image Installation pnpm pnpm add egami npm npm i egami Usage i
The Javascript and canvas port of MarkovJunior : A Probabilistic Programming Language.
MarkovJunior.js MarkovJunior is a probabilistic programming language where programs are combinations of rewrite rules and inference is performed via c
a 2D html canvas shooting game, implemented using vanilla JavaScript
EnemyShooting-Game a 2D single player enemy shooting game. It is an html canvas game, implemented using Vanilla JavaScript. Rules Killing each enemy w
Clone of the Fallout hacking mini-game, rendered into a browser canvas.
kodenkel-fo-hacking Clone of the Fallout hacking mini-game, rendered into a browser canvas. You can try it out at: https://www.kodenkel.com/games/fo-h
Simple Music Player App
Разработка музыкального плеера Разработка страницы музыкального плеера с возможностью поиска/выбора альбома для воспроизведения. Адаптивная верстка дл
Make configurable canvas easily with Canvafy.
Canvafy Make configurable canvas easily with Canvafy Installation npm i canvafy Documentation Rank Welcome And Leave Spotify Image Example of code con
Hexooor - Generate hexagonal Twitter NFT profile pictures client-side using HTML5 canvas
Hexooor - Generate hexagonal Twitter NFT profile pictures client-side using HTML5 canvas
Nebula is a lightweight (1kb compressed) JavaScript library that creates beautiful universe animations.
Nebula is a lightweight JavaScript library for creating beautiful universe animations. Including configurable Stars, Nebulas, Comets, Planets and Suns. Compatible with SSR
Perfect pressure-sensitive drawing for both iOS and Android.
rn-perfect-sketch-canvas A React Native component for drawing perfect pressure-sensitive freehand lines using perfect-freehand and Skia renderer. Inst
A r/place clone powered by websockets
canvas A r/place clone powered by websockets That's pretty much it. https://canvas.rto.run To build, run npm install and then node main.js to start th
🎬 super easy recording for p5.js animations
About • Why p5.capture? • Getting started • API Options • Browser compatibility • Limitations About Assuming you would like to record p5.js animations
This package generates a unique ID/String for different browsers. Like chrome, Firefox and any other browsers which supports canvas and audio Fingerprinting.
Broprint.js The world's easiest, smallest and powerful visitor identifier for browsers. This package generates a unique ID/String for different browse
An experimental hover effect, where a content preview is shown while a mini map indicates the position of the cursor.
Hover Preview Effect with Mini Map An experimental hover effect, where a content preview is shown while a mini map indicates the position of the curso
Canvas rendering library, Sprite manipulation of canvas
el-canvas Canvas rendering library, Sprite manipulation of canvas hello world div id="app"div/div/div yarn add elem-canvas or npm i
Easy Effect is a WYSIWYG Lottie animation editor, dedicated to helping you make dynamic effects easily.
Easy Effect 🖖 Introduction Easy Effect is a WYSIWYG animation editor based on Lottie. ✨ Feature 🌈 ease to use Anyone who want to create an animation
HTML5 Runner Game Made With Phaser.
"Hurry up Runner!" The Tunner Game "Hurry up!" Is A Small Funny Game Made With Phaser 3. This Game Is About Ordinary Salaryman That Hurries For His Jo
An implementation of Bézier curve rendering and manipulation, using the HTML5 Canvas API.
Bézier Curves An implementation of Bézier curve rendering and manipulation, using the HTML5 Canvas API. How does it work? Bézier curves can be simply
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 basic Typewriter effect.
Remotion video A basic Typewriter template. video.mp4 Commands Install Dependencies npm i Start Preview npm start Render video npm run build Upgrade R
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
GreetHub - Dynamic greeting for your readme profile 😍😍
GreetHub - Dynamic greeting for your readme profile 😍😍
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
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
Effect hooks that support ref.current dependency
use-ref-deps-effect Effect hooks that support "ref.current" dependency Install npm i use-ref-deps-effect Example import { useRefDepsEffect } from 'use
This script produce the video scroll effect that we can find on the Apple Website's
Scrollable Sequence Description This script produce the video scroll effect that we can find on the Apple Website's. This script is inspired from the
✂ 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
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
Write components once, run everywhere. Compiles to Vue, React, Solid, Angular, Svelte, and more.
Write components once, run everywhere. Compiles to: At a glance Mitosis is inspired by many modern frameworks. You'll see components look like React c
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
A tiny javascript library for obfuscating and revealing text in DOM elements
baffle.js A tiny javascript library for obfuscating and revealing text in DOM elements. camwiegert.github.io/baffle ~1.8kb gzipped ⚡ Dependency-free ?
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
Javascript library to draw and animate images on hover
Hover effect Javascript library to draw and animate images on hover. If this project help you, you like this library or you just want to thank me, you
🍞📊 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
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
Liquideffect - Javascript Library for creating liquid effect on image and RGB effect on mouse direction.
LiquidEffect Javascript Library for creating liquid effect on image and RGB effect on mouse direction. Demo https://liquideffect.netlify.app/ Dependen
Atropos - Stunning touch-friendly 3D parallax hover effects
Atropos Atropos is a lightweight, free and open-source JavaScript library to create stunning touch-friendly 3D parallax hover effects. Available for J
TypeWriter - Create easily a TypeWriter effect for your website
TypeWriter Create easily a TypeWriter effect for your website Written by Luuk Walstra Discord: Luuk#8524 Github: https://github.com/Luuk-Dev Replit: h
The Ripple Effect (An Ethereum-Based Fundraiser App)
The-Ripple-Effect---An-Ethereum-Based-Fundraiser-App - The Ripple Effect is a ethereum based fundraising app that can not only be used to donate to a specific cause but also to allocate/distribute funds with total transparency. The frontend has been made on ReactJS with the backend on Solidity with the help of Ganache.
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