DEV Community

Cover image for Particles websites templates and samples
Matteo Bruni for tsParticles

Posted on • Edited on

Particles websites templates and samples

I have started creating some particles animations related templates giving a simpler starting point for adding those animations to your websites.

You can find them here

GitHub logo tsparticles / templates

tsParticles website templates collection

banner

Awesome

tsParticles Websites and Templates Collection

tsParticles is a lightweight JavaScript/TypeScript library for creating easily particles animations in your websites.

The library has also official components for the most used JavaScript frameworks that you can see below.

If you have created a website with tsParticles and you want to share your template feel free to add a pull request to add it below.

Vanilla JavaScript / Plain HTML (tsparticles)

React JS (react-tsparticles)

If you have some cool website with these animations feel free to add a pull request.

I'm trying to publish templates for every JavaScript framework supported by tsParticles (Vanilla, React, VueJS, Angular, Preact, Inferno, Svelte, jQuery) so everyone can have a template ready to be used.

The first template added is a simple authentication form

Auth form

For now is ready for Vanilla Javascript, React, VueJS and Angular

GitHub logo tsparticles / auth-template

tsParticles Auth Template for Websites

tsParticles Authentication Template

tsParticles Simple Auth HTML Template for Websites

Login Page Preview

login

See working preview here

Register Page Preview

register

See working preview here

What is tsParticles

tsParticles is a lightweight library for easily creating particles animations in your websites or web applications.

The tsParticles library is ready to be used in standard JavaScript, React, Vue.js, Angular, Svelte, jQuery, Preact, Inferno.

Want to see more particles demos? Checkout this collection

Want to see more templates or want to share yours? Checkout this README




GitHub logo tsparticles / react-auth-template

tsParticles ReactJS Authentication Forms template

tsParticles React Authentication Template

tsParticles Simple Auth HTML Template for React Web Sites/Applications

Login Page Preview

login

See working preview here

Register Page Preview

register

See working preview here

What is tsParticles

tsParticles is a lightweight library for easily creating particles animations in your websites or web applications.

The tsParticles library is ready to be used in standard JavaScript, React, Vue.js, Angular, Svelte, jQuery, Preact, Inferno.

React tsParticles

The ReactJS official tsParticles library is react-tsparticles.

You read more about react-tsparticles here


Want to see more particles demos? Checkout this collection

Want to see more templates or want to share yours? Checkout this README




GitHub logo tsparticles / vue-auth-template

tsParticles VueJS Authentication Forms template

tsParticles VueJS Authentication Template

tsParticles Simple Auth HTML Template for VueJS Web Sites/Applications

Login Page Preview

login

See working preview here

Register Page Preview

login

See working preview here

What is tsParticles

tsParticles is a lightweight library for easily creating particles animations in your websites or web applications.

The tsParticles library is ready to be used in standard JavaScript, React, Vue.js, Angular, Svelte, jQuery, Preact, Inferno.

VueJS tsParticles

The VueJS official tsParticles library is particles.vue.

You read more about particles.vue here


Want to see more particles demos? Checkout this collection

Want to see more templates or want to share yours? Checkout this README




GitHub logo tsparticles / angular-auth-template

Angular tsParticles Authentication Forms template

tsParticles Angular Authentication Template

tsParticles Simple Auth HTML Template for Angular Web Sites/Applications

Login Page Preview

login

See working preview here

The template won't display directly, follow the Login link

Register Page Preview

register

See working preview here

The template won't display directly, follow the Register link

What is tsParticles

tsParticles is a lightweight library for easily creating particles animations in your websites or web applications.

The tsParticles library is ready to be used in standard JavaScript, React, Vue.js, Angular, Svelte, jQuery, Preact, Inferno.

Angular tsParticles

The Angular official tsParticles library is ng-particles.

You read more about ng-tsparticles here


Want to see more particles demos? Checkout this collection

Want to see more templates or want to share yours? Checkout this README




Top comments (0)