Templates
Collection of variety of reusable components of HTML, CSS and JavaScript.
What you can make:
- Profile card template
- Reviews card template
- Contact section template
- Theme toggle
- Skills section template
- Hero section template
- Navigation Bar
- Projects Section
... and many more
This project is perfect for people starting out with opensource and knows basics of frontend development. This doesn't mean this project is just for beginners, even if you are someone who is into development for a while and have done opensource before you can still make this project better.
For more experienced developers:
- Animations with JavaScript
- Page Loaders
- Interactive Portfolio Templates
- And other things that are complex for a beginner developers.
Website Build
Hi,
Have u any plan to create a static website? This website will preview all the templates.
Also, can you checkout this repo, Because, there is a possibility to copy the templates. Make sure that there is no copy from open source template.
https://github.com/learning-zone/website-templates
Addding Glassmorphism Loader
Have an idea for a new HTML, CSS, or JS template? Describe it here.
I made an animated Glassmorphism loader.
Add a design file/ Screenshot of the template you want
https://user-images.githubusercontent.com/98695632/195987229-a856e5e1-ddcb-4d9d-9ea5-2a0773548a37.mp4
Template not described well
This template is not described well in its Readme file.
What you have to do:
Payment Gateway template
Have an idea for a new HTML, CSS, or JS template? Describe it here.
Payment gateway template
Add a design file/ Screenshot of the template you want
List all the functionalities/ animations it should have(if any)
Updated PR template
What type of PR is this? (check all applicable)
Description
Updated the PR template.
Related Tickets & Documents
Mobile & Desktop Screenshots/Recordings (if there are UI changes)
Added to documentation?
[optional] Are there any post-deployment tasks we need to perform?
[optional] What gif best describes this PR or how it makes you feel?
Create a Template Guideline READE.md
The README is for folks who want to contribute a new template to this project.
README should have the following things in it:
Template README should have the following things in it:
Note: Every contributor have to follow these guidelines and then only the PR will get merged.
Adding Profile Card
Have an idea for a new HTML, CSS, or JS template? Describe it here.
I have made a profile card.
Add a design file/ Screenshot of the template you want
https://user-images.githubusercontent.com/98695632/193603384-c143df99-1942-42c2-9648-91511d0b9c99.mp4
Portfolio Templates
What type of PR is this? (check all applicable)
Description
Related Tickets & Documents
Mobile & Desktop Screenshots or GIFs(If Template have animations)
Added to documentation?
[optional] Are there any post-deployment tasks we need to perform?
[optional] What gif best describes this PR or how it makes you feel?
New Project Structure
What type of PR is this? (check all applicable)
Description
Related Tickets & Documents
Mobile & Desktop Screenshots or GIFs(If Template have animations)
Added to documentation?
[optional] Are there any post-deployment tasks we need to perform?
[optional] What gif best describes this PR or how it makes you feel?
Improve the project readme
As many new components templates are added, edit the project readme to add screenshots and gifs of other templates contributed.
Note: No need to change other things.
What you can do:
Create a website
Create New Templates
You can contribute HTML, CSS, and JavaScript components which are often used in many websites like:
There are many more such templates that you folks can contribute and enrich this repository. Note: Follow our Template Guidelines and Contribution Guidelines and we will merge your PR.
How to start:
Add readme files and comments in existing templates
Note: If you want to fix(add comments, readme file, or CSS variables) a component template or multiple components then first create an issue for it(if it's not already created). Or if you can just comment here with the link of the template you want to fix.