301 Repositories
JavaScript text-animation Libraries
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
Algorithm visualizer made with React, Material UI and P5JS.
Made with React, P5JS and Material UI. Link https://andresrodriguez55.github.io/algorithmsVisualizer/#/ Description The purpose of doing this was to l
Adds Syntax Highlighting & Hint for TiddlyWiki5 tiddlers (text/vnd.tiddlywiki) to the CodeMirror.
CodeMirror-Mode-TiddlyWiki5 Adds Syntax Highlighting for TiddlyWiki5 tiddlers (text/vnd.tiddlywiki) to the CodeMirror, along with some other useful ed
plain text editor
writer Plain text editor from scratch, made for the web. Drag and drop files to open them. Architecture Buffer is an array of array of lines Text is m
Theatre.js is an animation library for high-fidelity motion graphics.
Theatre.js is an animation library for high-fidelity motion graphics. It is designed to help you express detailed animation, enabling you to create intricate movement, and convey nuance.
Firebase Extension to automatically push Firestore documents to Typesense for full-text search with typo tolerance, faceting, and more
Firestore / Firebase Typesense Search Extension ⚡ 🔍 A Firebase extension to sync data from your Firestore collection to Typesense, to be able to do f
This is a particle animation art piece using threejs.
3d-particle-mofing ● DEMO Usage Clone repository Install Node.js Create an .env file and copy the contents of .env-sample. Run following commands np
A shopping mobile application made with react native for Android.
Shop App Description This project is a simplified implementation of a shopping system, the project aims to provide the basic features that are expecte
An experimental inline-to-menu-link animation based on a concept by Matthew Hall.
Inline to Menu Link Animation An experimental inline-to-menu-link animation based on a concept by Matthew Hall. Article on Codrops Demo Installation I
A library to add a virtual Trackball to your DOM
Trackball.js - 3D Trackballs for your Website Trackball.js is a small JavaScript library on top of Quaternion.js to enable free 3D rotation of element
A powerful WYSIWYG rich text web editor by pure javascript
KothingEditor A powerful WYSIWYG rich text web editor by pure javascript Demo : kothing.github.io/editor The KothingEditor is a lightweight, flexible,
This is a small web application I made using Vanilla Javascript. It's a text generator that cooks up classic lyrics (lorem ispum style) from the rap collective Wu Tang Clan. This was a blast to make and I hope others can get some use out of it, or at least a good laugh.
Wu Tang Lorem Ipsum Text Generator This is a small web application I made using Vanilla Javascript. It's a text generator that cooks up classic lyrics
Translate text to morse code, but the morse code is emojis
morsemoji Convert text to morse code... with emojis! Check it out! This project was built with React, Vite, Emoji Mart, Nord, and react-copy-to-clipbo
Generate text meme
text-meme-cli Generate text meme Install $ npm install --global text-meme-cli Usage $ text-meme --help Usage $ text-meme "Don't forget to be a
Sublime-like terminal-based text editor
slap 👋 slap is a Sublime-like terminal-based text editor that strives to make editing from the terminal easier. It has: first-class mouse support (ev
A light wight javascript image viewing plugin with smooth animation and 0 dependence
A light wight javascript image viewing plugin with smooth animation and 0 dependence
A speech recognition library running in the browser thanks to a WebAssembly build of Vosk
A speech recognition library running in the browser thanks to a WebAssembly build of Vosk
Animatelo is a bunch of cool, fun, and cross-browser animations for you to use in your projects. This is a porting to Web Animation API of the fabulous animate.css project.
Animatelo Just-add-water Web Animations Animatelo is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emp
❄️ Add a live frosted glass blur effect over any type of web content, including text.
Frosted Glass ❄️ Add a live frosted glass blur effect over any type of web content, including text. ️️ Demos Install npm install frosted-glass --save
The Illusion of Life: An SVG Animation Case Study
svgAnimation.js is a Snap.svg plugin used to create complex animations from simple SVGs svgAnimation takes the complexity out of creating Snap.svg ani
Lightweight, simple to use jQuery plugin to animate SVG paths
jQuery DrawSVG This plugin uses the jQuery built-in animation engine to transition the stroke on every path inside the selected svg element, using
Lazy Line Painter - A Modern JS library for SVG path animation
Lazy Line Painter lazylinepainter.info A Modern JS library for SVG path animation Getting Started | Documentation | Examples | Lazy Line Composer Gett
An experimental SVG letter animation inspired by the Dribbble shot ["Shading Letters in Illustrator"](https://dribbble.com/shots/2943049-Shading-Letters-in-Illustrator) by Jake Bartlett's. Powered by Julian Garnier's [anime.js](http://anime-js.com/).
Fancy SVG Letter Animation An experimental SVG letter animation inspired by the Dribbble shot "Shading Letters in Illustrator" by Jake Bartlett's. Pow
circle-svg-animation
Circle SVG Animation Plug css, js and just add short code in your html. Change the custom attribute data-percent and data-time for setting your percen
Javascript and SVG odometer effect library with motion blur
SVG library for transitioning numbers with motion blur JavaScript odometer or slot machine effect library for smoothly transitioning numbers with moti
CSS loading animations with minimal effort!
Whirl CSS loading animations with minimal effort! whirl is a curation of CSS loading animations(whirls! 😅 ). It started as a drop in CSS file to get
A little library that can be used for bursting particles effects on buttons and other elements
Particle Effects for Buttons Bursting particles effects for buttons. By Luis Manuel. Article on Codrops Demo Credits anime.js Basic usage The Particle
Pure CSS (no JavaScript) implementation of Android Material design "ripple" animation
Pure CSS ripple effect (no JavaScript) CSS-only implementation of Android Material design "ripple" animation on click event Main advantage of this sol
A set of buttons with a magnetic interaction and a hover effect.
Magnetic Buttons A small set of magnetic buttons with some fun hover animations. Inspired by the button animation seen on Cuberto. Article on Codrops
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
Demonstration of different animation effects with AngularJS ngView directive.
ngView-animation-effects This is a simple demonstration of how easy you can make your ngView directive transition pages with nice animations. All you
⌨️ 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
"shuffle-text" is JavaScript text effect library such as cool legacy of Flash.
ShuffleText This is the JavaScript library for text effect such as Flash contents. Setup Script Install script src="shuffle-text.js"/script NPM In
Simple styles and effects for enhancing text input interactions.
Text Input Effects Simple styles and effects for enhancing text input interactions. Article on Codrops Demo Integrate or build upon it for free in you
PowerModeInput can make your text input box more compelling
PowerModeInput PowerModeInput can make your text input box more compelling This project can make your input box lively. One day I saw a vscode plugin
image/video/content slideshow engine providing high quality animation effects including Kenburns Effect and GLSL Transitions.
Diaporama Diaporama is an image/video/content slideshow engine providing high quality animation effects including Kenburns effect and GLSL Transitions
Animated haze distortion effect for images and text, with WebGL.
Animated Heat Distortion Effects with WebGL A tutorial on how to use fragment shaders in WebGL to create an animated heat haze distortion effect on im
A sticky image effect for a slideshow inspired by ultanoir's website.
How to Create a Sticky Image Effect with Three.js A sticky image effect for a slideshow inspired by ultanoir's project showcase slideshow. Article on
👓 Parallax tilt hover effect for React JS - tilt.js
React.js - Tilt.js React version of tilt.js Demo https://vx-demo.now.sh/gallery Install yarn: yarn add react-tilt npm: npm install --save react-tilt U
A vue.js particles animation background component
particles-bg-vue A vue.js particles animation background component. Use it to make your website look cool. Check it out if you want to use it in React
React particles animation background component
particles-bg React component for particles backgrounds This project refers to the source code of the Proton official website, I packaged it into a com
A lightweight jQuery plugin for collapsing and expanding long blocks of text with "Read more" and "Close" links.
Readmore.js V3 alpha I am deprecating the 2.x version of Readmore.js. A new version is coming soon! Check it out and help me test it! Readmore.js A sm
Text-based user interface CSS library
TuiCss Text-based user interface CSS library -- Documentation -- About TuiCss is a library focused to create web applications using an interface based
Collection of tools for building rich text editors.
psst we have great documentation at https://bangle.dev What is bangle.dev ? bangle.dev is a collection of components for building powerful editing exp
Open source rich text editor based on HTML5 and the progressive-enhancement approach. Uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag soups and inline styles.
This project isn’t maintained anymore Please check out this fork. wysihtml5 0.3.0 wysihtml5 is an open source rich text editor based on HTML5 technolo
A completely customizable framework for building rich text editors. (Currently in beta.)
A completely customizable framework for building rich text editors. Why? · Principles · Demo · Examples · Documentation · Contributing! Slate lets you
curl.js is small, fast, extensible module loader that handles AMD, CommonJS Modules/1.1, CSS, HTML/text, and legacy scripts.
curl (cujoJS resource loader) All development for curl.js and cram.js has stopped. For the foreseeable future, we will continue to respond to issues o
The lightweight library for manipulating and animating SVG
SVG.js A lightweight library for manipulating and animating SVG, without any dependencies. SVG.js is licensed under the terms of the MIT License. Inst
Popline is an HTML5 Rich-Text-Editor Toolbar
popline Popline is a non-intrusive WYSIWYG editor that shows up only after selecting a piece of text on the page, inspired by popclip. Usage Load jQue
Open source rich text editor based on HTML5 and the progressive-enhancement approach. Uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag soups and inline styles.
This project isn’t maintained anymore Please check out this fork. wysihtml5 0.3.0 wysihtml5 is an open source rich text editor based on HTML5 technolo
A React framework for building text editors.
Draft.js Draft.js is a JavaScript rich text editor framework, built for React and backed by an immutable model. Extensible and Customizable: We provid
A lightweight and amazing WYSIWYG JavaScript editor - 20kB only (8kB gzip)
Supporting Trumbowyg Trumbowyg is an MIT-licensed open source project and completely free to use. However, the amount of effort needed to maintain and
A rich text editor for everyday writing
Trix A Rich Text Editor for Everyday Writing Compose beautifully formatted text in your web application. Trix is a WYSIWYG editor for writing messages
The world's #1 JavaScript library for rich text editing. Available for React, Vue and Angular
TinyMCE TinyMCE is the world's most advanced open source core rich text editor. Trusted by millions of developers, and used by some of the world's lar
HTML5 rich text editor. Try the demo integration at
Squire Squire is an HTML5 rich text editor, which provides powerful cross-browser normalisation in a flexible lightweight package (only 16.5KB of JS a
Tiny bootstrap-compatible WISWYG rich text editor
bootstrap-wysiwyg Important information for Github requests/issues Please do not submit issues/comments to this repo. Instead, submit it to https://gi
Medium.com WYSIWYG editor clone. Uses contenteditable API to implement a rich text solution.
If you would be interested in helping to maintain one of the most successful WYSIWYG text editors on github, let us know! (See issue #1503) MediumEdit
Quill is a modern WYSIWYG editor built for compatibility and extensibility.
Note: This branch and README covers the upcoming 2.0 release. View 1.x docs here. Quill Rich Text Editor Quickstart • Documentation • Development • Co
Fast and powerful CSV (delimited text) parser that gracefully handles large files and malformed input
Parse CSV with JavaScript Papa Parse is the fastest in-browser CSV (or delimited text) parser for JavaScript. It is reliable and correct according to
:fishing_pole_and_fish: A library that allows you to access the text selected by the user
selecting A library that allows you to access the text selected by the user. Instalation To install Selecting, execute: npm install selecting Or Bow
:speech_balloon: Speech recognition for your site
annyang! A tiny JavaScript Speech Recognition library that lets your users control your site with voice commands. annyang has no dependencies, weighs
Automatically add a progress bar to your site.
PACE An automatic web page progress bar. Demo Documentation Include pace.js and the theme css of your choice on your page (as early as is possible), a
Responsive and slick progress bars
ProgressBar.js Responsive and slick progress bars with animated SVG paths. Use built-in shapes or create your own paths. Customize the animations as y
The responsive CSS animation framework for creating unique sliders, presentations, banners, and other step-based applications.
Sequence.js The responsive CSS animation framework for creating unique sliders, presentations, banners, and other step-based applications. Sequence.js
Magically convert a simple text input into a cool tag list with this jQuery plugin.
jQuery Tags Input Plugin Do you use tags to organize content on your site? This plugin will turn your boring tag list into a magical input that turns
Makes typing in input fields fun with CSS3 effects
Fancy Input Makes typing & deleting in input/Textarea fields exciting & fun with CSS3 effects. View Demo Page Basic use example: !-- ...previous page
Automatically persist your forms' text and select field values locally, until the form is submitted.
Garlic.js Garlic.js allows you to automatically persist your forms' text and select field values locally, until the form is submitted. This way, your
Make your text sizing responsive!
jQuery responsiveText A jQuery plugin to set font sizes responsively based on its' container width. Use jQuery responsiveText to have scalable headlin
Text Neon Golden effect jQuery plug-in
novacancy.js novacancy.js is a text neon golden effect jQuery plugin. Demo Visit demo site Basic Usage Just use $('#no').novacancy(); or detail $('#no
Add a super simple rotating text to your website with little to no markup
#Super Simple Text Rotator by Pete R. A light weight jQuery plugin that will allow you to add a super simple rotating text to your website with little
A JavaScript library that lets you curve type on the web.
CircleType A JavaScript library that lets you curve type on the web. Demo: https://circletype.labwire.ca Installation In a browser: script src="circl
jQuery plugin, calculates the font-size and word-spacing needed to match a line of text to a specific width.
BigText BigText Makes Text Big Read the original blog post Play around on the demo Watch the video Download bigtext.js Or use bower: bower install big
🍿 A cross-browser library of CSS animations. As easy to use as an easy thing.
Animate.css If you need the old docs - v3.x.x and under - you can find it here. Just-add-water CSS animation Installation Install with npm: npm instal
GreenSock's GSAP JavaScript animation library (including Draggable).
GSAP (GreenSock Animation Platform) Professional-grade animation for the modern web GSAP is a robust JavaScript toolset that turns developers into ani
A high-performance, dependency-free library for animated filtering, sorting, insertion, removal and more
MixItUp 3 MixItUp is a high-performance, dependency-free library for animated DOM manipulation, giving you the power to filter, sort, add and remove D
A modern, simple and elegant WYSIWYG rich text editor.
jQuery-Notebook A simple, clean and elegant WYSIWYG rich text editor for web aplications Note: Check out the fully functional demo and examples here.
Simple rich text editor (contentEditable) for jQuery UI
Hallo - contentEditable for jQuery UI Hallo is a very simple in-place rich text editor for web pages. It uses jQuery UI and the HTML5 contentEditable
The next generation Javascript WYSIWYG HTML Editor.
Froala Editor V3 Froala WYSIWYG HTML Editor is one of the most powerful JavaScript rich text editors ever. Slim - only add the plugins that you need (
Lightweight, simple to use jQuery plugin to animate SVG paths
jQuery DrawSVG This plugin uses the jQuery built-in animation engine to transition the stroke on every path inside the selected svg element, using
A vanilla JS customisable select box/text input plugin ⚡️
Choices.js I'm looking for active maintainers for this project as I no longer have the time to support it. Please get in touch if you're interested 👍
The first truly composable CSS animation library. Built for Vue, React, SCSS, and CSS, AnimXYZ will bring your website to life.
AnimXYZ animxyz.com AnimXYZ helps you create, customize, and compose animations for your website. Powered by CSS variables to allow a nearly limitless
A renderless rich-text editor for Vue.js
We’re working on tiptap 2. Become a sponsor to get access immediately! Sponsor 💖 tiptap A renderless and extendable rich-text editor for Vue.js [FAQ]
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,
:black_medium_small_square:React Move | Beautiful, data-driven animations for React
React-Move Beautiful, data-driven animations for React. Just 3.5kb (gzipped)! Documentation and Examples Features Animate HTML, SVG & React-Native Fin
Open source, production-ready animation and gesture library for React
An open source and production-ready motion library for React on the web. Framer Motion is an open source, production-ready library that's designed for
🇨🇭 A React renderer for Three.js
react-three-fiber react-three-fiber is a React renderer for threejs. npm install three @react-three/fiber Why? Build your scene declaratively with re-
A spring that solves your animation problems.
React-Motion import {Motion, spring} from 'react-motion'; // In your render... Motion defaultStyle={{x: 0}} style={{x: spring(10)}} {value = div
✌️ A spring physics based React animation library
react-spring is a spring-physics based animation library that should cover most of your UI related animation needs. It gives you tools flexible enough
:fireworks:Interactive Online Platform that Visualizes Algorithms from Code
Algorithm Visualizer Algorithm Visualizer is an interactive online platform that visualizes algorithms from code. Learning an algorithm gets much easi
The lightweight library for manipulating and animating SVG
SVG.js A lightweight library for manipulating and animating SVG, without any dependencies. SVG.js is licensed under the terms of the MIT License. Inst
🐿 Super easy and lightweight(3kb) JavaScript animation library
Overview AniX - A super easy and lightweight javascript animation library. AniX is a lightweight and easy-to-use animation library with excellent perf
React particles animation background component
particles-bg React component for particles backgrounds This project refers to the source code of the Proton official website, I packaged it into a com
Animation library that mimics CSS keyframes when scrolling.
Why Motus ? Motus allows developers to create beatuful animations that simulate css keyframes and are applied when the user scrolls. Features Node & B
Javascript and SVG odometer effect library with motion blur
SVG library for transitioning numbers with motion blur JavaScript odometer or slot machine effect library for smoothly transitioning numbers with moti
A jquery plugin for CSS3 text animations.
Textillate.js v0.4.1 See a live demo here. Textillate.js combines some awesome libraries to provide an easy-to-use plugin for applying CSS3 animations
CSS3 backed JavaScript animation framework
Move.js CSS3 JavaScript animation framework. About Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant. Be
GreenSock's GSAP JavaScript animation library (including Draggable).
GSAP (GreenSock Animation Platform) Professional-grade animation for the modern web GSAP is a robust JavaScript toolset that turns developers into ani
The motion graphics toolbelt for the web
mo · js – The motion graphics toolbelt for the web. Intro mo · js is a javascript motion graphics library that is a fast, retina ready, modular and op
Accelerated JavaScript animation.
Velocity beta NPM: npm install velocity-animate@beta Docs https://github.com/julianshapiro/velocity/wiki IMPORTANT: The velocityjs.org documentation r
JavaScript animation engine
anime.js JavaScript animation engine | animejs.com Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful AP