Skip to content

Beautiify comprises a curated selection of beautifully designed components and animations that can be seamlessly incorporated into any website, elevating its overall UI experience.

License

Notifications You must be signed in to change notification settings

samarsajad/Beautiify

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

✨Beautiify✨

Open Source Love svg1 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. Loaders -- Loaders indicate the loading process. Beautiify features various loader designs such as Bird Loader, Clock Loader, Helix Loader, and so on.

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

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

  13. 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.

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

  15. 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⭐

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 Click-The-Edible-Game.

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)

About

Beautiify comprises a curated selection of beautifully designed components and animations that can be seamlessly incorporated into any website, elevating its overall UI experience.

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 43.5%
  • CSS 41.2%
  • JavaScript 15.3%