color-psychology

README.md for GitHub – Psychology of Colors Website

Psychology of Colors – Website

Project Description

This website explores the significance of colors and their psychological impact in marketing, design, and various industries. It includes dynamic content, tables, an interactive slider, and a fully responsive design.

---

Technologies Used

The project is built with:

• HTML5 – Page structure
• CSS3 – Styling and layout
• JavaScript – Dynamic content
• Responsive Design – Optimized for mobile devices

---

📂 Project Structure

📂 psychology-of-colors │── 📂 css/ │ ├── newcss.css # Main CSS file │── 📂 js/ │ ├── JSSlaid.js # Scripts for the slider │ ├── jsMenuMobile.js # Scripts for the mobile menu │ ├── jsScriptContactForm.js # Scripts for the contact form │── 📂 images/ │ ├── … (images and icons) │── 📜 index.html # Homepage │── 📜 colors.html # Color meanings │── 📜 combinations.html # Color combinations │── 📜 industries.html # Colors in industries │── 📜 best-practices.html # Best practices │── 📜 contact.html # Contact form │── 📜 README.md # This file

---

Main Pages and Features

Home (index.html)

• Introduction to color psychology
• Main navigation menu
• Responsive design for mobile screens

Colors (colors.html)

• Table of color meanings
• Interactive hover effects
• Photos slider
• Responsive design

Color Combinations (combinations.html)

• List of the best color pairings
• Photos slider
• Responsive design

Industries (industries.html)

• How different industries use colors
• Layout structured with CSS Grid
• Responsive design

Best Practices (best-practices.html)

• Tips for choosing the right colors
• Examples of effective color usage
• Responsive design

Contact Form (contact.html)

• JavaScript validation
• Dynamic message submission

---

Features

✅ Responsive design – Works on phones, tablets, and desktops
✅ Interactive slider – Auto-changing images
✅ Dynamic navigation – Adaptable mobile menu
✅ Color tables – Well-structured and readable color meanings
✅ CSS animations – Smooth transitions and hover effects

---

How to Use the Code?

1. Clone the repository ```sh git clone https://github.com/verginiyakirilova/psychology-of-colors.git

2. Open the project in a browser : https://verginiyakirilova.github.io/color-psychology/

cd psychology-of-colors open index.html

3.	Modify CSS and JavaScript as needed
•	CSS: css/newcss.css
•	JavaScript: js/jsScript.js

💡 Authors & Contributions

This project was developed with contributions from: • Verginiya Kirilova – Frontend & UI/UX Design