Skip to content

Latest commit

 

History

History
222 lines (159 loc) · 12.2 KB

README.md

File metadata and controls

222 lines (159 loc) · 12.2 KB
Raw

✨Beautiify✨

Open Source Love svg1 Netlify Status PRs Welcome Visitors GitHub forks GitHub Repo stars GitHub contributors GitHub last commit GitHub repo size Github GitHub issues GitHub closed issues GitHub pull requests GitHub closed pull requests

Table of Contents🧾


Introduction📌

Beautiify is a comprehensive collection of meticulously crafted components and animations designed to enhance the aesthetic appeal and user experience of any website. Whether you are building a simple landing page or a complex web application, Beautiify provides you with the tools to create visually stunning and highly interactive user interfaces.

Features💡

Beautiify offers a diverse range of components and animations designed to enhance the user interface of any website. Each component is available in multiple designs, providing ample customization options.

Components🎨

  1. Accordions -- Accordions are expandable sections that reveal or hide content when clicked. Beautiify offers various styles, including 3D Accordion, Glassmorphism Accordion, Horizontal Picture Accordion, and so on.

  2. Backgrounds -- Beautiify includes a collection of visually appealing backgrounds to enhance the look of your site. Options include 3D Boxes Background, Abstract Background, Animated Colorful Background, and so on.

  3. Breadcrumbs -- Breadcrumbs provide navigational links to enhance user experience. Available designs include 3D Breadcrumb, Animated Breadcrumb, Gaming Breadcrumb, and so on.

  4. Buttons -- Stylish and functional buttons are available in different shapes and sizes. Designs include Blob Button, Glow Button, Hover Button, and so on.

  5. Cards -- Cards are versatile containers for displaying content. Beautiify provides various card designs, such as 3D Animated Card, Blog Post Card, Flip Card, and so on.

  6. Carousels -- Carousels are rotating sliders for showcasing images or content. Available types include 3D Image Carousel, Draggable Carousel, Neumorphism Carousel, and so on.

  7. Dropdowns -- Dropdowns allow users to select options from a list. Beautiify offers several styles which include Apple Themed Dropdown, and The More Menu Dropdown.

  8. Footers -- Footers are customizable sections at the bottom of pages. Beautiify includes Animated Footer, Classic Footer, Waves Footer, and so on.

  9. Forms -- Forms are essential for user input. Beautiify provides a range of form designs, including Animated Login Form, Black Red Signup Form, Contact Form, and so on.

  10. Heroes -- Heroes are a large, attention-grabbing picture with text typically shown in the above-the-fold area. Beautiify provides various hero designs such as Carousel Hero, Collage-Style-Hero and so on.

  11. Loaders -- Loaders indicate the loading process. Beautiify features various loader designs such as Bird Loader, Clock Loader, Helix Loader, and so on.

  12. Navigation Bars -- Navigation Bars provide links for site navigation. Beautiify offers Circular Navigation Bar, Hamburger Navigation Bar, Overlay Navigation Bar, and so on.

  13. Popups -- Popups display messages or content overlays. Available designs include Context Menu Popup, Error Notification Popup, Success Notification Popup, and so on.

  14. Search Bars -- Search Bars enable users to search content on your site. Beautiify provides 3D Search Bar, Google Search Bar, Neumorphism Search Bar, and so on.

  15. Text Animations -- Text Animations add dynamic effects to text. Beautiify includes Flip Text Animation, Fog Text Animation, Glowing Text Animation, and so on.

  16. Toggle Switches -- Toggle switches prompt users to choose between two mutually exclusive options and always have a default value. Available designs are Robo Toggle Switch, Light Toggle Switch, and so on.

  17. Tooltips -- A tooltip is a brief, informative message that appears when a user interacts with an element. Beautiify provides various designs like Animated Tooltip, Shopping Cart Tooltip, and so on.

  18. Transfer Lists -- Transfer Lists allow items to be moved between lists. Available styles are Neuromorphism Transfer List.

Technology Used🚀

HTML CSS JS

(back to top)

Overview⭐

Live Project -- (https://beautiify.netlify.app/)

Home/Main Page :-

image

Components Page :-

image

Contact Page :-

image

(back to top)

Getting Started💥

  • Fork this Repository.
  • Clone the forked repository in your local system.
git clone https://github.com/<your-github-username>/Beautiify.git
  • Open index.html in your browser.
  • View the Live Project here.
  • Raise an issue if you find a bug or add a feature.
  • Wait for the issue to be assigned and proceed only after the issue is assigned to you.
  • Navigate to the project directory.
cd Beautiify
  • Create a new branch for your feature.
git checkout -b <your_branch_name>
  • Perfom your desired changes to the code base.
  • Track and stage your changes.
# Track the changes
git status

# Add changes to Index
git add .
  • Commit your changes.
git commit -m "your_commit_message"
  • Push your committed changes to the remote repo.
git push origin <your_branch_name>
  • Go to your forked repository on GitHub and click on Compare & pull request.
  • Add an appropriate title and description to your pull request explaining your changes and efforts done.
  • Click on Create pull request.
  • Congrats! 🥳 You've made your first pull request to this project repo.
  • Wait for your pull request to be reviewed and if required suggestions would be provided to improve it.
  • Celebrate 🥳 your success after your pull request is merged successfully.

(back to top)

Contributing Guidelines📑

Read our Contributing Guidelines to learn about our development process, how to propose bugfixes and improvements, and how to build to Beautiify.

Code Of Conduct📑

This project and everyone participating in it is governed by the Code of Conduct. By participating, you are expected to uphold this code.

This repo has been part of the following Open Source Programs🥳

IWOC2024
IWOC 2k24 		JWOC2024
JWOC 2k24 		SWOC2024
SWOC 2k24

(back to top)

Project Admin⚡

Rakesh Roshan
Rakesh Roshan

Project Contributors🫂

Contributing is fun🧡

forthebadge

Contributions of any kind from anyone are always welcome🌟!!

Give it a 🌟 if you ❤ this project. Happy Coding👨‍💻

(back to top)