Animated Login Form Using HTML & CSS

Подписаться 29 тыс.

Просмотров 1,4 млн

50% 1

-------------------------------------------🇮🇳-----------------------------------------
* JAI HIND DOSTO, WELCOME TO MY CHANNEL*
-------------------------------------------------------------------------------------------
Aj ki is Video Mai Ham log kuch Naya sikhenge, Agar Video Achi Lage to LIKE Kare Aur Agar Kuch Na Kuch Daily Sikhna Chate ho channel ko SUBSCRIBE Karke Bell Icon Press Karke Jise Hamara Koi Video ka Notification Miss Na Ho.
Today's Topic: how to change colur of Orbiting animation using html css only?
Official website 👉hashtechie007.blogspot.com/?m=0
Top videos:-
1.Dynamic island Effects • Dynamic island Animati...
2.Pulse heart Effects • Pulsing Heart Animatio...
3.Neon button Effects • CSS Neon Button effect...
4.Rainbow border Animations Effects • Rainbow🌈 Border Animat...
5.Frosted Glass Effect • Frosted Glass Effects ...
6.Birtday Box Effects • Responsive Birthday Gi...
7.Digital Clock • Digital Clock Using Ja...
8.orbiting animation • Orbiting Animation Eff...
-Thank you
-------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------
STAY TUNED FOR LATEST UPDATE
------------------------------------------------------------------------------------------
login form in html and css,login form html css,html css,html login form,animated login form html css,animated login form using only html & css,transparent login form html css,login form,html,html css login form,login form using html and css,login html css,login form in html,registration form using html and css,css,html and css,html css login form design,responsive login form html css,css login form,login page html css,login form design
#css#animation#csstutorial#codewithharry
#loginform

Опубликовано:

8 янв 2023

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 699

@hash_techie Год назад

Source code--- github.com/Hashtechieofficial/Form- Background Link-- www.wallpaperflare.com/digital-digital-art-artwork-illustration-minimalism-simple-wallpaper-gjwxk

@Aryan_Raj_7167 Год назад

@Hash Techie You can pin this comment . So, your viewers can get this comment on top and they can find your comment easily. by your Subscriber

@RNR000 Год назад

I need a little help, I tested the code in my system but some of the codes didn't work. Then I went to the GitHub site and copy pasted the full code. Now css file is not even being recognised by the HTML file.

@Yotapaki Год назад

Remember me and forgot password on same line? i think you need to separate it.

@xavier6130 Год назад

Remember me • Forgot password?

@tonniecuts Год назад

Need help how can I reach you

@teemolert Год назад

when I saw the thumbnail for this video I assumed the CSS was going to be very complex but when you actually break it down into its individual steps its actually suprisingly to make a nice looking website

@tekamanurag6065 Год назад

guess i don't have any talent in designing.

@PolPingo Год назад

Tbh it looked very simple to me. Reading the title i was expecting some crazy animation. Still a pretty simple but very effective design for a login page

@teemolert Год назад

@@PolPingo yeah fair enough, im pretty new to css and making webpages look nice so even simple things seem pretty complex to me right now.

@z-matrix Год назад

CSS is a simple language, there is no secret, if it were a professional code [even just html and css] it would require other concepts that go far beyond a code as basic as this one.

@teemolert Год назад

@@z-matrix Yes but its more about the process which does take lots of learning to get down. I struggle to actually get my ideas down with css.

@dipereira0123 Год назад

The Idea, The Creation Process, The Result, The fact that you teach us to how to do it... Its Beautiful! This is a form of Art! Liked Subscribed and notifications Activated

@matthewstrauck4646 Год назад

Great video, really shows how the whole coding process of a website works and thus helps with learning 👍🏽

@exoticlol Год назад

Maybe you could give the "Remember Me" and "Forgot Password" elements more spacing.

@hash_techie Год назад

My mistake bro you can change the property of css.

@Hypenexy Год назад

Better yet, make them block elements and let them have their own vertical space

@Bigwealth21 Год назад

My mentor

@echetammesoma7232 Год назад

I had this in mind

@gengrim2333 Год назад

Didn't bother at the end probably

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

Awesome bro!!!, I recently started learning web developement and you have cleared my many doubts. AMAZING BRO!

@boteich3118 7 месяцев назад

Great, nice animated login form, I really liked it, continue to create layouts and send videos to your RU-vid channel

@abhishekvishwakarma3482 Год назад

Bro.... You are amazing, You made awesome website, If I had to do it with scratch I would take more tha a week 😂 But you did awesome work bro 👏

@levi9613 Год назад

Very simple yet ELEGANT

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

Thank you so much for this amazing tutorial your work really inspires to continue doing better keep up the good work 🔥🔥

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

when i saw the thumbnail this video i think this is to tough to make but and when i saw the video step by step and release it is very crazy and impressive. you make the login form in a 15 mint😍 but i make it in a month😁. keep going to make us motivate. And LOve from PAKISTAN ,PUNJAB ,NANKANA SAHIB❤❤

@penguin1714 Год назад

Wish we could get this as a sddm login theme. Looks great

@InfiniteM13 Год назад

You've earned me a subscribe just because of using ncs songs, love the work btw💕

@MisterToine972 Год назад

Thank you so much for your work and for sharing it 🙏🏽

@Casonplayz Год назад

Cool I wish log in pages like this were done more

@guillermomazzari4983 Год назад

Beautiful work! Thanks for sharing!

@hash_techie Год назад

Thanks

@sphinx_z Год назад

Stunning Animated Login Form!

@ximaxwellix Год назад

For anyone who wants to fix the label dropping back down when the input is not a valid email: 1. Add placeholder=" " to the inputs in HTML for both email and password Eg.: 2. Change "input:focus ~ label, input:valid ~ label" to "input:focus ~ label, input:not(:placeholder-shown) ~ label" This way, as long as the placeholder " " is shown, the labels are down. But whenever we insert something, the label stays up. Theoretically, something like input:not([value=""]) should work as well, but I didn't get that to work. I am also still learning HTML/CSS

@sirsuer6726 Год назад

thx for sharing.

@sychose.3597 Год назад

still doesn't work

@cawankeven6718 Год назад

THXXXXXXXXXXXXXXXXX

@weirdo_fy Год назад

Thanks bro, it worked.

@geraldrollner4842 Год назад

now the password goes down also instead of only email

@CrashQwerty Год назад

ohh man this video is amazing, i need this examples because i like the practice and the documention in more occasions it's very confuse

@NovaAbstract Год назад

seeing it all come to life is pretty cool

@mortalmotivation Год назад

I love this kind of teaching, thank you

@Phuc-A-gy9mq Год назад

This is just amazing and touching 💓💓

@hash_techie Год назад

Thanks

@KGee911 Год назад

Thank you very much.. this is really helpful 👏 👌

@kyledaines2428 Год назад

This could possibly be the best DC trailer ever.

@dylankc1 Год назад

This is so amazing. Thank you so much for sharing this!

@hash_techie Год назад

❤️

@melroijohnlardizabal 3 месяца назад

Very nice! I love glass morphism!❤

@emnd4540 Год назад

Good job bro. Thanks for the video ❤ New subscriber here

@ferasalfarsi897 Год назад

Amazing work! Keep up!

@user-sb9lt9bn4g Год назад

I love this video.Thanks for sharing 😊

@hash_techie Год назад

Thanks buddy

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

Thanks for your help. I love this video

@fozanalikhan Год назад

Awesome work buddy simple CSS with so good looking website page

@hash_techie Год назад

Thanks bhai

@imusinghuzuni Год назад

We need companies to hire this guy as their designers.

@hash_techie Год назад

Thanks ❤️❤️❤️❤️

@imusinghuzuni Год назад

@@hash_techie These are amazing, and completely perfect. I would love to see websites using them

@tarekehab9113 Год назад

Really nice sir that’s great back ground

@hash_techie Год назад

Thanks bro

@jaegercrown964 Год назад

This is very amazing thanks for sharing

@seanmaddows9790 Год назад

Great design and nice video

@ft.akaiiii Год назад

I am learning to code and your channel is helpful!! Thank you Bhai! ✨

@hash_techie Год назад

Thanks

@hash_techie Год назад

Dude for comment ❤️

@aminansarimehr9464 Год назад

It's very good and useful for me Thank you 🙏

@ravish8620 Год назад

Beautiful♥️

@hash_techie Год назад

Thanks dude

@jaganniwas826 11 месяцев назад

Oh Thanks, it helped me a lot, I appreciate it!

@oscar8677 Год назад

Great video and clear login

@hash_techie Год назад

Thanks sir

@RDFContent Год назад

Brilliant video but what alot of people don't do who do these in then show the viewers how to take that code & upload it somewhere so its visible when you then go to a webpage.

@ElZorrO-RD- 10 месяцев назад

bro eres un master me fue genial gracias a Dios y a tu video

@kodirovnodirbek6849 Год назад

Thanks, it was helpful!

@criscaicedo1748 Год назад

Amazing! Thank you

@eliott2307 Год назад

You did a good job, well done !

@hash_techie Год назад

Then bro check other one

@hash_techie Год назад

Thanks bro

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

I love this channel helped me start my coding career

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

❤️❤️

@fiazkhokharfiazkhokhar1900 Год назад

such a good work

@ketankushwah6488 Год назад

Amazing👍

@hash_techie Год назад

Thanks

@franescobar89 Год назад

muy bueno!! yo agregaría que el texto de mail y password al subir disminuya el font-size como si fuese un legend

@hash_techie Год назад

Thanks

@kyh148 Год назад

Looks great

@RCWolf Год назад

this is awesome, also nice background I've used the same one for everything for years XD

@hash_techie Год назад

Oh cool

@yazuka2023 Год назад

I have a problem thhe background that I saved in my pc isnt showing

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

@@yazuka2023 I having same issue

@badbunny6941 Год назад

Cool 🔥❤️

@hash_techie Год назад

Thanks bro

@dark_soul9318 Год назад

Cool really inspiring..

@KelKnows Год назад

I'm learning how to code now and what your doing looks godly compared to what I'm doing right now.😭 Good job

@alexandre1383 Год назад

I started studying HTML and CSS three weeks ago and I feel the same way! 😅

@KelKnows Год назад

@@alexandre1383 I’m learning python 🥲

@dannyjenkins1408 Год назад

Honestly learn some basic javascript then come back to HTML and CSS. Otherwise youre gonna get stuck as a beginner. My js is pretty advanced and i still need to google absolutely everything when it comes to CSS, html is easy after javascript so dont worry about that.

@KelKnows Год назад

@@dannyjenkins1408 so should I continue with Python?

@kirysha52 Год назад

@@KelKnows if you are learning html and css,you need to be + - medium in that, to you can make good projects and after start to learn some js. i am on this way now.i started learn js few days ago. so i will learn to junior or medium level, after still learn it with css , make animation in css and also in js.i wanna become really good in html and css to work on frilans,and learn react js , typescript js and vue js. and i am crazy 13 years russian boy.))

@touristsworld349 Год назад

very nice bro ..More power to you

@UltraNyan Год назад

13:00 I would just leave the colors like they are, very human design, very pleasing to the eye.

@alexandre1383 Год назад

So beautiful and clean

@hash_techie Год назад

Thanks

@elsachichon9429 Год назад

Very Good bro, is amazing

@manvirsingh5381 Год назад

AMAZING ❤️

@danielescobar6933 Год назад

Eso es magia 🤩

@hash_techie Год назад

Thanks bro new video coming soon stay tuned.

@COD5Yuri Год назад

Looks great! Only thing to complain about is the contrast in the last paragraph, which is difficult to read for people with visual impairments.

@hash_techie Год назад

Sorry for inconvenience bro , check the source code which is pinned at comments section

@TheBelpahar Год назад

wow.. super.. mind blowing

@hash_techie Год назад

New one coming soon

@AlexIlyaGuennad Год назад

Just awesome Thank yo uso much!

@notaftershook8642 Год назад

People seeing that email and password label moving: oh that's nice. Meanwhile developers putting in 15 minutes of work just to make a super simple thing: 💀

@supremeomegacompany Год назад

Great awasome

@santhosharts4028 Год назад

thats really good bro

@hash_techie Год назад

Thanks bro

@fcpolon1a543 5 месяцев назад

Hmmm that is very interesting... Now I'm gonna copy paste it without even trying to understand anything

@CreativeGamerAbhi Год назад

Bht badhia bhala lagila dekhiki madi chala .....

@CreativeGamerAbhi Год назад

reply if you understand ha ha..... btw great work bro

@hash_techie Год назад

I think you are from west Bengal,assam

@parsuramnaik500 Год назад

thanks bhai.. u got a new subscriber

@juanjoseperezramos1982 Год назад

Looks nice bro

@nicolafontaine9919 Год назад

Woa thanks man ! I was wondering how do you do to put a video in the background instead of the picture ? Do you just have to change the CSS file with the video ?

@rafi-leigh 8 месяцев назад

You still want to know?

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

@@rafi-leighI would like to, since I didn't understand that part

@dheylinantigua Год назад

Amazing I love it !

@hash_techie Год назад

Thanks

@MA-hp9eo Год назад

Love it!

@JustAPersonWhoComments Год назад

man this feels like Discord login in a whole new level

@hash_techie Год назад

❤️

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

Good idea 😮

@hackersaqib786 Год назад

Excellent Work Bro

@hash_techie Год назад

Thanks sir ji😌

@nicholasdaily2589 Год назад

I have never ever seen people using the contrasting colours like that to visualize what they are working with. That was like an aha moment for me. I went to school for three years for this lol I’m just - wow lol thanks for sharing. Definitely will be using this technique !!

@pricilaleitesilva Год назад

Very good 👏

@WinWin-vl6du Год назад

Wow that's so awesome I tried it!!

@hash_techie Год назад

Check more

@hash_techie Год назад

Thanks

@Dhykaputra23 Год назад

thanks for sharing

@JeremyStreich Год назад

For accessibility reasons your input need to IDs and your labels' for attribute should be the id the field they are the label for. This will let screen readers and other assistive technologies work and allow the site to be used by people with disabilities. And the a tag for forgotten password should not part of the label, as that link doesn't describe the checkbox. Moreover, links need to be set off from normal text by at least two distinguishing characteristics -- by making it white and the same font size and font weight not all users will realize those are links.

@carlosgonzaga2084 Год назад

awesome!!!

@milandharani1125 Год назад

this video really deserve one like and comment

@veeee5577 Год назад

Just wow 👑

@angnguyenkhanhminh8697 Год назад

Great. Thanks a lot!

@hash_techie Год назад

❤️

@angnguyenkhanhminh8697 Год назад

@@hash_techie When I fill the email by the autofill of Edge and the input is not transparent because the text which autofill fills in the input tag is black. I don't know how to fix this problem. Please help me! Thank you