HTML ad tag preview - Powered by Ad Reform

Live Preview

Tag didn’t load? Click here and let us know!
538x221
117 KB
Share this result

Previews are deleted daily. Get a permanent share link sent to your inbox:
Script

Open in browser
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Aryan Academy | Computer Skill</title>

  <style>
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      scroll-behavior: smooth;
      font-family: Arial, sans-serif;
    }

    body {
      background: #f5f8ff;
      color: #222;
      line-height: 1.6;
    }

    /* NAVBAR */
    nav {
      background: #071952;
      color: white;
      padding: 15px 7%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: sticky;
      top: 0;
      z-index: 1000;
    }

    .logo {
      font-size: 25px;
      font-weight: bold;
      color: #00d9ff;
    }

    nav ul {
      list-style: none;
      display: flex;
      gap: 25px;
    }

    nav ul li a {
      color: white;
      text-decoration: none;
      font-weight: bold;
    }

    nav ul li a:hover {
      color: #00d9ff;
    }

    /* HERO */
    .hero {
      min-height: 90vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 40px 20px;
      background: linear-gradient(135deg, #071952, #088395);
      color: white;
    }

    .hero h1 {
      font-size: 52px;
      margin-bottom: 15px;
    }

    .hero h1 span {
      color: #00eaff;
    }

    .hero p {
      font-size: 21px;
      margin-bottom: 30px;
    }

    .btn {
      display: inline-block;
      padding: 13px 25px;
      margin: 7px;
      border-radius: 30px;
      text-decoration: none;
      font-weight: bold;
      background: #00d9ff;
      color: #071952;
      border: none;
      cursor: pointer;
    }

    .btn:hover {
      background: white;
    }

    .whatsapp {
      background: #25D366;
      color: white;
    }

    /* SECTIONS */
    section {
      padding: 70px 7%;
    }

    .title {
      text-align: center;
      margin-bottom: 40px;
    }

    .title h2 {
      font-size: 35px;
      color: #071952;
    }

    .title p {
      color: #666;
    }

    /* ABOUT */
    .about {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      align-items: center;
    }

    .about-box {
      background: white;
      padding: 30px;
      border-radius: 15px;
      box-shadow: 0 5px 20px #dce3f2;
    }

    .about-box h3 {
      color: #088395;
      margin-bottom: 15px;
    }

    /* COURSES */
    .courses {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 25px;
    }

    .course {
      background: white;
      padding: 30px;
      border-radius: 15px;
      text-align: center;
      box-shadow: 0 5px 20px #dce3f2;
      transition: 0.3s;
    }

    .course:hover {
      transform: translateY(-8px);
    }

    .course .icon {
      font-size: 45px;
      margin-bottom: 10px;
    }

    .course h3 {
      color: #071952;
      margin-bottom: 10px;
    }

    .fee {
      color: #088395;
      font-size: 22px;
      font-weight: bold;
      margin-top: 10px;
    }

    /* FEATURES */
    .features {
      background: #071952;
      color: white;
    }

    .features .title h2 {
      color: white;
    }

    .feature-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }

    .feature {
      text-align: center;
      padding: 25px;
      background: #10256d;
      border-radius: 15px;
    }

    .feature div {
      font-size: 35px;
    }

    /* GALLERY */
    .gallery {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }

    .gallery img {
      width: 100%;
      height: 220px;
      object-fit: cover;
      border-radius: 15px;
    }

    /* CONTACT */
    .contact {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 30px;
    }

    .contact-box {
      background: white;
      padding: 30px;
      border-radius: 15px;
      box-shadow: 0 5px 20px #dce3f2;
    }

    .contact-box h3 {
      color: #071952;
      margin-bottom: 15px;
    }

    form input,
    form textarea,
    form select {
      width: 100%;
      padding: 13px;
      margin: 8px 0;
      border: 1px solid #ddd;
      border-radius: 8px;
      outline: none;
    }

    form textarea {
      height: 120px;
      resize: none;
    }

    /* FOOTER */
    footer {
      background: #050d2d;
      color: white;
      text-align: center;
      padding: 25px;
    }

    footer span {
      color: #00d9ff;
    }

    /* MOBILE */
    @media (max-width: 800px) {
      nav {
        flex-direction: column;
        gap: 10px;
      }

      nav ul {
        gap: 12px;
        flex-wrap: wrap;
        justify-content: center;
      }

      .hero h1 {
        font-size: 38px;
      }

      .about,
      .contact {
        grid-template-columns: 1fr;
      }

      .courses,
      .gallery {
        grid-template-columns: 1fr;
      }

      .feature-grid {
        grid-template-columns: 1fr 1fr;
      }
    }

    @media (max-width: 500px) {
      .feature-grid {
        grid-template-columns: 1fr;
      }
    }
  </style>
</head>

<body>

  <!-- NAVBAR -->
  <nav>
    <div class="logo">ARYAN ACADEMY</div>

    <ul>
      <li><a href="#home">Home</a></li>
      <li><a href="#about">About</a></li>
      <li><a href="#courses">Courses</a></li>
      <li><a href="#gallery">Gallery</a></li>
      <li><a href="#contact">Contact</a></li>
    </ul>
  </nav>


  <!-- HERO -->
  <section class="hero" id="home">
    <div>
      <h1>Welcome to <span>Aryan Academy</span></h1>

      <p>
        Learn Computer Skills • Build Your Future • Start Your Career
      </p>

      <a href="#courses" class="btn">View Courses</a>

      <a href="tel:932505760" class="btn">
        📞 Call Now
      </a>

      <a href="https://wa.me/91932505760" class="btn whatsapp">
        💬 WhatsApp
      </a>
    </div>
  </section>


  <!-- ABOUT -->
  <section id="about">
    <div class="title">
      <h2>About Aryan Academy</h2>
      <p>Your journey towards better computer skills starts here.</p>
    </div>

    <div class="about">

      <div class="about-box">
        <h3>💻 Computer Skill Academy</h3>

        <p>
          Aryan Academy is a computer skill training institute
          focused on practical learning and career development.
        </p>

        <br>

        <p>
          We provide beginner-friendly computer courses designed
          for students, job seekers and anyone who wants to improve
          their digital skills.
        </p>
      </div>

      <div class="about-box">
        <h3>🎯 Our Mission</h3>

        <p>
          To provide quality computer education at an affordable
          price and help students become confident in using
          technology.
        </p>

        <br>

        <p>
          <b>📞 Contact:</b> 932505760
        </p>

        <p>
          <b>📍 Address:</b> Your Academy Address Here
        </p>
      </div>

    </div>
  </section>


  <!-- COURSES -->
  <section id="courses" style="background:#eef4ff;">

    <div class="title">
      <h2>Our Courses</h2>
      <p>Choose the right computer course for your future.</p>
    </div>

    <div class="courses">

      <div class="course">
        <div class="icon">🖥️</div>
        <h3>Basic Computer</h3>
        <p>Learn computer fundamentals, typing, internet and digital skills.</p>
        <div class="fee">₹1,500</div>
      </div>

      <div class="course">
        <div class="icon">📊</div>
        <h3>MS Office</h3>
        <p>Learn MS Word, Excel, PowerPoint and office productivity skills.</p>
        <div class="fee">₹2,500</div>
      </div>

      <div class="course">
        <div class="icon">💼</div>
        <h3>Tally</h3>
        <p>Learn accounting basics, Tally and practical business skills.</p>
        <div class="fee">₹3,000</div>
      </div>

      <div class="course">
        <div class="icon">🌐</div>
        <h3>Internet & Digital Skills</h3>
        <p>Learn online services, email, internet and digital tools.</p>
        <div class="fee">₹1,500</div>
      </div>

      <div class="course">
        <div class="icon">⌨️</div>
        <h3>English Typing</h3>
        <p>Improve your English typing speed and accuracy.</p>
        <div class="fee">₹1,000</div>
      </div>

      <div class="course">
        <div class="icon">🚀</div>
        <h3>Advanced Computer</h3>
        <p>Advanced computer knowledge for study and career development.</p>
        <div class="fee">₹4,000</div>
      </div>

    </div>
  </section>


  <!-- FEATURES -->
  <section class="features">

    <div class="title">
      <h2>Why Choose Aryan Academy?</h2>
      <p style="color:#ddd;">Learn better. Learn practically.</p>
    </div>

    <div class="feature-grid">

      <div class="feature">
        <div>👨‍🏫</div>
        <h3>Expert Training</h3>
        <p>Easy and practical teaching.</p>
      </div>

      <div class="feature">
        <div>💻</div>
        <h3>Practical Classes</h3>
        <p>Learn by doing real exercises.</p>
      </div>

      <div class="feature">
        <div>💰</div>
        <h3>Affordable Fees</h3>
        <p>Quality education at reasonable fees.</p>
      </div>

      <div class="feature">
        <div>🏆</div>
        <h3>Career Skills</h3>
        <p>Build useful skills for your future.</p>
      </div>

    </div>
  </section>


  <!-- GALLERY -->
  <section id="gallery">

    <div class="title">
      <h2>Our Gallery</h2>
      <p>Academy photos</p>
    </div>

    <div class="gallery">

      <!-- Replace these images with your own photos -->

      <img
        src="https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=800&q=80"
        alt="Computer Class">

      <img
        src="https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=800&q=80"
        alt="Computer Training">

      <img
        src="https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=800&q=80"
        alt="Students Learning">

    </div>
  </section>


  <!-- CONTACT -->
  <section id="contact" style="background:#eef4ff;">

    <div class="title">
      <h2>Contact Aryan Academy</h2>
      <p>For admission and course information, contact us.</p>
    </div>

    <div class="contact">

      <div class="contact-box">

        <h3>📍 Academy Information</h3>

        <p><b>Academy:</b> Aryan Academy</p>

        <p><b>Type:</b> Computer Skill Training</p>

        <p><b>Phone:</b> 932505760</p>

        <p><b>Address:</b> Your Academy Address Here</p>

        <br>

        <a href="tel:932505760" class="btn">
          📞 Call Academy
        </a>

        <a href="https://wa.me/91932505760" class="btn whatsapp">
          💬 WhatsApp
        </a>

      </div>


      <div class="contact-box">

        <h3>📝 Admission Enquiry</h3>

        <form onsubmit="sendWhatsApp(); return false;">

          <input
            type="text"
            id="name"
            placeholder="Your Name"
            required>

          <input
            type="tel"
            id="phone"
            placeholder="Your Mobile Number"
            required>

          <select id="course">

            <option value="">
              Select Course
            </option>

            <option>Basic Computer</option>
            <option>MS Office</option>
            <option>Tally</option>
            <option>Internet & Digital Skills</option>
            <option>English Typing</option>
            <option>Advanced Computer</option>

          </select>

          <textarea
            id="message"
            placeholder="Your Message">
          </textarea>

          <button type="submit" class="btn">
            Send Enquiry
          </button>

        </form>

      </div>

    </div>
  </section>


  <!-- FOOTER -->
  <footer>

    <p>
      © 2026 <span>Aryan Academy</span>.
      All Rights Reserved.
    </p>

    <p>
      Computer Skill Training
    </p>

  </footer>


  <!-- WHATSAPP FORM SCRIPT -->
  <script>

    function sendWhatsApp() {

      let name =
        document.getElementById("name").value;

      let phone =
        document.getElementById("phone").value;

      let course =
        document.getElementById("course").value;

      let message =
        document.getElementById("message").value;

      let text =
        "Hello Aryan Academy,%0A%0A" +
        "Name: " + name + "%0A" +
        "Mobile: " + phone + "%0A" +
        "Course: " + course + "%0A" +
        "Message: " + message;

      let url =
        "https://wa.me/91932505760?text=" + text;

      window.open(url, "_blank");
    }

  </script>

</body>
</html>
Landing Page

This ad does not have a landing page available
Network Timeline

Performance Summary

Requests
Domains
123KB
Transfer Size
123KB
Content Size
96.0ms
Dom Content Loaded
292.0ms
First Paint
219.0ms
Load Time
Domain Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests
Timings (ms)
Total Time
Content Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests