Share on facebook
Share on twitter
Share on linkedin
Share on pinterest

Glassmorphism Digital Clock UI Design | Html CSS & Vanilla Javascript

Enroll My Course : Next Level CSS Animation and Hover Effects

Another Course : Build Complete Real World Responsive Websites from Scratch
Join Our Channel Membership And Get Source Code of My New Video’s Everyday!
Join :

Source Code :
Facebook Page :
Instagram :
Twitter :
Website :

Buy Me A Coffee :

give proper credit if you repost this on other social media platform

Inspired By These

FullScreen Responsive Digital Clock Design Using Html CSS & Vanilla Javascript

Make an Analog & Digital Minimalist Clock Using Vanilla Javascript

Pure CSS Circular Progress Bar | CSS Glassmorphism Effects

Real Glassmorphism Card Hover Effects | Html CSS Glass morphism Effects

Disclaimer video is for educational purpose only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for “fair use” for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is a use permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favor of fair use

Support site by sharing this post

Share on facebook
Share on twitter
Share on pinterest
Share on linkedin
Share on reddit
Share on tumblr
Share on stumbleupon
  1. why i am getting error as 00:00:00 am after run
    function Clock()


    let hour = document.getElementById('hour');

    let minute = document.getElementById('minute');

    let seconds = document.getElementById('seconds');

    let ampm = document.getElementById('ampm');

    let h = new Date().gethours();

    let m = new Date().getminute();

    let s = new Date().getseconds();

    var am = "AM";

    hour.innerHTML = h;

    minute.innerHTML = m;

    seconds.innerHTML = s;


    var interval = setInterval(Clock, 1000);

  2. Hi, why I can't see the real time, it stays on 00:00:00 AM, I see errors inside the function clock:
    Let hour = …
    Let minute = …

    Let seconds = …
    Let ampm = …
    Let h = …
    Let m = …
    Let s = …
    Here I see errors why?

  3. Hi! It's a great tutorial! But I've noticed one mistake. When you are converting 24 hour time to 12 hour format time, you need to use h >= 12 condition, because 12 hours in 24 hour time is already 12pm. But the meridian indicator will show 'AM' instead of 'PM'.

Leave a Reply

Your email address will not be published. Required fields are marked *