How To Add A Clock In OBS - CSS IS BETTER

Scott shows how to setup a analog clock for OBS Studio using the CSS method. This method is much better than any LUA script. ★★ CLICK SHOW MORE ★★ There's crucial info below!!!

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
WAIT TILL YOU SEE THESE KILLER FREE ANIMATED SUBSCRIBE BUTTONS.
I spent five long days learning how to make subscribe buttons in Blender.
The animations are KILLER, and I made 10 of them for you COMMERCIAL FREE.
IF YOU SIGN UP YOU WILL RECEIVE MORE THAN JUST SUB BUTTONS
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

TUTORIAL LINKS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

SUPPORT SCOTT'S CAUSE WITH A DONATION

SUBSCRIBE TO THE CHANNEL

#scottfichter #scottfichterobs #obsstudio

0:00 Demo
0:44 Shoutout
1:26 How Codepen Works
2:51 Understanding Copen Comments
3:41 Making the Clock Background Transparent
4:06 Changing the Clock Face
5:04 Change color of the Clock hands.
5:55 Changing length and width of the hands
6:58 How to run the clock from your computer
8:50 How to show the clock in OBS Studio

2.0 - - 3/9/22

[GregMurrayEnt]

Scott, in order to export the zip file, one needs to create a free account with Codepen.

[DanyV]

HTML, CSS and Javascript... I didn't know that this would have such an awesome potential with OBS. Awesome!

[WebbsWeb]

That's pretty cool! Well done, Scott.

[potterb]

Great tutorial with a relatable analogy.

[GordIsman]

HUGE... so many great clock options... and a great tutorial. Thanks, Scott!

[radiogareth]

Thanks for this, saw it on a friends stream and asked. Easy to follow tutorial too, including the usage in OBS :-)

[joetkeshub]

You save my day. Helpful and instructive. Thank you Scott. You earned a follower ;)

[PaulineSmartlife]

Great tutorial and thank you for sharing. Will have a go at this later. I am a total OBS newbie.

[theorignl]

#1 @Scott really, really nice analogy of the HTML, CSS and JS components. #2 very clear and concise tutorial. no auspiciously distracting use of graphics, straight forward instructions. NICE!

[brianpagemodeltrains]

Thanks for the shoutout, Scott, and thanks for all the work you put into making the buttons. Awesome tutorial on the clocks!

[SCOARTGLASS]

Thanks. Another great video. Didn’t see zip file and signed up for email list last week. Not sure if that was in time or not. Loved the sub buttons. Used them in my last video.

[MrJani]

0:44 i confirmed my mail and i didn't recieve any link for download... it's just redirecting to another site... and where are other PNGs files of clocks, there are only two in google drive link

[EdwardFowler]

Wondering if you could do a video of having different times clock on screen like on news channel for example let's say its 7pm BST it would change to 2pm EST and so on if that makes sense can't seem to find the video I'm looking for on YouTube.

[COIFISHGAMING]

Great stuff Scott you are really onto something with your channel direction with the exclusive graphics yet smart enough to give all viewers something! Keep on Fighting brother! I use the Subscribe graphic all the time ;)

[Imkenster]

Another Great learning experience for me - Thanks Scott. I would like to get with you on Lower Thirds and if it is possible to change or drop down to the next lower third once all 10 memory slots have run on the first lower third. I figured the timing deal between the memory boxes now would like to see can it automatically go to the next one. Ie - Lower Third 1 drops to Lower Third 2 etc etc. Thanks so much I am learning so much from you!

[Marvin_mole]

Thank you Scott I have a clock on my Stream but I need a new one cheers Again, #Getsome

[beauthompson]

Hi, Scott great video do you have a digital version of this using codepen?

[HeyHedgehog]

Hey Scott. Far and wide you are by far the best content creator when it comes to both being innovative, doing a lot of the researching legwork, and teaching it while being extremely thorough and entertaining.

That being said I have two questions-

Do you know if there would be a good, feasible way to create an effect that can make images have more of a retro effect and feel? In terms of like, for example, what is done to emulate 70’s/80’s/90’s broadcasting with subtle noise and discoloration effects? I know many artists like to make use of different, slightly offset RGB layers and perlin noise and overlays to create similar effects, but can OBS accomplish this?

Secondly- do you have a page or community or perhaps even a site other than PayPal to be able to support you and send donations? (Like patreon or Ko-Fi)


Thank you!!! You are a rockstar!!!

[googleppe]

Thank you for this guide. I'm using OBS on Ubuntu 18.04 but clock is not visible.

[MookieMc]

Lucky for me, I made time for this. (chirp ... chirp)

"Time".. get it? You have done a tutorial for a clock. Oh, forget it.

But on a serious note, thanks for the hints and amazing content.