Quantum Robotics Landing Page

A modern, responsive landing page for Quantum Robotics Inc., a future-focused company specializing in AI and robotics technology.

Description

This landing page showcases Quantum Robotics' cutting-edge AI and robotics solutions. The page features a clean, modern design with sections highlighting the company's mission, features, pricing plans, product gallery, and frequently asked questions.

Features

• Responsive Design: Fully responsive layout that works on mobile, tablet, and desktop devices
• Modern UI: Clean and professional interface with smooth animations
• Multiple Sections:
  • Hero section with call-to-action
  • Company details and mission
  • Feature highlights showcasing core technology
  • Pricing plans with comparison
  • Product gallery with image showcase
  • FAQ section for common questions
  • Contact information and footer
• Interactive Elements: Navigation menu, hover effects, responsive cards, and buttons

Technologies Used

• HTML5
• CSS3
• Custom CSS Variables for theming
• Media Queries for responsive design
• Flexbox and Grid layouts
• Google Fonts (Inter, Raleway, Lato)

Installation

• Clone the repository: git clone https://github.com/vkprogrammer-001/QuantumRobotics.git

• Navigate to the project directory: cd QuantumRobotics

• Open the index.html file in your preferred browser:

  open index.html  # macOS
  #or
  start index.html  # Windows
  

File Structure

LandingPage/
├── index.html      # Main HTML file
├── index.css       # Component-specific styles
├── style.css       # Global styles and variables
└── README.md       # Project documentation

Customization

Colors

The project uses CSS variables for easy color customization. Main colors can be modified in the style.css file:

:root {
  --dl-color-primary1-blue60: #e2ddf5ff;
  --dl-color-primary1-blue80: #5228f5ff;
  --dl-color-primary1-blue100: #291477ff;
  /* Other color variables */
}

Fonts

The project uses Google Fonts. You can modify the font imports in the index.html file:

<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&amp;display=swap"
  data-tag="font"
/>
<!-- Other font imports -->

Browser Support

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)
• Opera (latest)

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Acknowledgments

• Images from Unsplash
• Icons and design inspiration from various open-source projects

---

Made with ❤️ by vkprogrammer-001