Analog Clock HTML CSS Javascript Dark Mode

Поделиться
HTML-код
  • Опубликовано: 31 май 2024
  • "Learn to make your own Analog Clock using Javascript with just few codes."
    / @codebraces
    In this video, we will create and design a dark with glowing effects analog clock using basic code of html, css and javascript. First, we will create from the basic by creating our analog clock using html code by adding numbers and hands of the clock with simple css design. Then, we will add a functionality to make the clock work by adding javascript code. Finally, we will finalize the design of our analog clock by making it dark and put some glowing effects.
    🎞Video Timestamps:
    0:00 Intro.
    0:15 Creating clock numbers.
    2:47 Creating clock hands.
    4:35 Adding javascript code to make the clock hands work.
    6:45 Finalizing the design.
    ✨ HTML CSS and Javascript Projects
    [Drag and Drop File Input]: [ • Drag and Drop File Inp... ]
    [Calculator]: [ • Calculator App in HTML... ]
    [Fist in Aquarium]: [ • Fish in Aquarium using... ]
    [Full Playlist]: [ • HTML, CSS and Javascri... ]
    ⚠️ Important Notice:
    This video is a silent journey through the code, perfect for those who prefer to learn without commentary, focusing solely on the development process.
    👩‍💻 Why This Format?
    I understand that everyone has their unique learning style. Some find music and words distracting, while others thrive on detailed explanations. This video caters to visual learners and those who appreciate the tranquility of coding in silence, making it a perfect fit for focused learning sessions or background inspiration.
    💡 Did You Enjoy This Video?
    Hit that Like button and Subscribe to my channel @codebraces more coding adventures! Don’t forget to ring the bell 🔔 so you won’t miss any of my future videos.
    💬 Got Questions or Feedback?
    Your thoughts mean the world to me! Drop a comment below with your questions, feedback, or even suggestions for future videos. I'm all ears and here to support your coding journey.
    💡 Code Smart NOT Hard 💡
    🚀 Until Next Time, Keep Coding and Be Awesome! 🚀
    #analogclock
    #htmlcssjavascriptproject
    #diyclock
    #htmltutorial
    #csstutorial
    #javascripttutorial
  • ХоббиХобби

Комментарии • 32

  • @ibnhabous4939
    @ibnhabous4939 9 месяцев назад

    good work

  • @vikramchauchan4359
    @vikramchauchan4359 9 месяцев назад

    Very nice work, keep doing. dont stop yourself.

  • @irfanhsajid1
    @irfanhsajid1 10 месяцев назад +1

    impressive work! Thanks for this.

  • @passionforcoding
    @passionforcoding 9 месяцев назад

    ❤❤❤Awesome 😊😊😊

  • @nogxz_l1554
    @nogxz_l1554 9 месяцев назад

    Good job

  • @arpitpandey2842
    @arpitpandey2842 9 месяцев назад

    Nice work bro

  • @francesco.paletta
    @francesco.paletta 9 месяцев назад

    Thanks for you work! I love this Clock!

  • @user-fw5nd4dk6k
    @user-fw5nd4dk6k 10 месяцев назад

    good work bro make more videos

  • @Factfinitys
    @Factfinitys 10 месяцев назад

    good

  • @omarzaky646
    @omarzaky646 9 месяцев назад

    How a greatness ❤❤

  • @pedrodavi_05
    @pedrodavi_05 4 месяца назад

    thank you so much! i from Brazil and like your video, please continue with content!

  • @vfxentity
    @vfxentity 8 месяцев назад

    this guy is making me question my css skills

  • @tat-lyubch
    @tat-lyubch 9 месяцев назад

    Very good! My clock looks like moon elipse...

  • @pramanandasarkar-sb4ut
    @pramanandasarkar-sb4ut Месяц назад

    nice clock by html css and js

  • @Nemesis-db8fl
    @Nemesis-db8fl 9 месяцев назад +8

    Man i thought i knew css but after watching this video I'm not sure if i even know 10% of css

    • @TabahiOnTheBeat
      @TabahiOnTheBeat 9 месяцев назад +1

      Not that hard sometimes he used clac function but it's easy topic.....😇

    • @S-Lomar
      @S-Lomar 8 месяцев назад

      🤣🤣😂😂😂🤣🤣🤣🤣🤣🤣🤣🤣🤣🤣🤣🤣🤣🤣😂😂😂😂😂😂😂😂😂😂😂😂😂😂😂😂😂😂watch and do practice

    • @nkedemgildas3281
      @nkedemgildas3281 3 месяца назад

      Same dear I just noticed I know nothing in CSS😂

    • @veshaw.
      @veshaw. 12 дней назад

      I don't even wanna live anymore 😭😭😭

  • @cliffvincenttorrevillas9650
    @cliffvincenttorrevillas9650 8 месяцев назад

    Drop the source code♥️♥️🤧very beautiful

  • @chhayadubey3096
    @chhayadubey3096 9 месяцев назад

    Bhai mere jo style ne jo( -- i=1) ye kya h...? Css variable bhi na h na hi ye koi style h... Hai kya?

  • @WebDevXpert
    @WebDevXpert 21 день назад

    Creating a Basic Analog Clock with HTML, CSS, and JavaScript || JavaScript Clock || By WebDev Xpert : ruclips.net/video/d5WtJeHGHm0/видео.html

  • @waleedhassanpanjtani
    @waleedhassanpanjtani 6 месяцев назад

    My clock did'nt work. Kindly tell me.

  • @opivcm4566
    @opivcm4566 7 месяцев назад +1

    bro source code please

  • @Cobalt_Chevrolet
    @Cobalt_Chevrolet 9 месяцев назад

    Where is the code?

  • @betimmustafi2097
    @betimmustafi2097 8 месяцев назад

    can you send the source code

  • @inspiropeak511
    @inspiropeak511 9 месяцев назад +1

    Hy bro I want this background music 🎵
    May you give me please 🥺

    • @codebraces
      @codebraces  9 месяцев назад

      Its on the description. I downloaded it audio library

  • @amirhosseinjafary2648
    @amirhosseinjafary2648 2 месяца назад

    The source

  • @digsffx07
    @digsffx07 Месяц назад

    Code bro

  • @abdullahabada2222
    @abdullahabada2222 9 месяцев назад

    What n: 1means

    • @1newbbie
      @1newbbie 9 месяцев назад

      css variable