Neumorphism UI Button | Pure CSS Tutorial
HTML-код
- Опубликовано: 17 мар 2020
- Creating a button with Neumorphism UI.
-----------------------------------------------------------------------------------
❤️Get in touch:
Email: mitali@codingartistweb.com
Website: codingartistweb.com
Instagram: / coding.artist
-----------------------------------------------------------------------------------
⭐Tools Used:
Text Editor: Sublime Text
Live Coding: Browser Sync Plugin
-----------------------------------------------------------------------------------
🎵Music:
Track: The Perpetual Ticking of Time - Artificial.Music [Audio Library Release]
Music provided by Audio Library Plus
Watch: • The Perpetual Ticking ...
Free Download / Stream: alplus.io/PerpetualTickingOfTime
Intro Music:
Track: JPB - High [NCS Release]
Music provided by NoCopyrightSounds.
Watch: • JPB - High | Trap | NC...
Free Download/ Stream: ncs.io/jpbhigh
I'm relatively new to web dev, so watching this video I was in a constant state of "THAT'S INGENIOUS!!" lol
I like the style of the button and the music.
Great tutorial! Thank you so much for posting.
You're Awesome !!
I DIDN'T KNOW THERE WAS A "content" TAG!!!!! I'm losing my mind over this!
You know how helpful this would have been in my Web Dev 2 final!?
You know all the things I could have done with this!?
This is art
Thanks for this awesome tutorial 👍
it's also cool to add: transform: box-shadow 300ms ease-in-out; for a smooth checking effect
how do i implement this?
like as
input[type="checkbox"]:transform{
box-shadow 300ms ease-in-out;
}
?
you r just awesome man
You are just awesome
amo css porque puedes cambiar de color gracias por los videos que ases!!!!!!
marvelous..
I like your all codes Mitali.
Full support from here...
Thank you
Simple and sweet tutorial, I like all 5 min tutorials, a very educational channel. You should do a Udemy class, hardly any female educator there.
Awesome
Its cool 😎👌
Gorgeous,
THANK YOU FOR SHARE
Awesome...
Wow, it's nice
Impresionante! Es muy loco hacer un sitio web sólo con éste estilo de UI? Muchas gracias, realmente me encanta las cosas que hacés!
si es muy loco
Found your channel on sololearn.. Great stuff
Thank You!!!!
excalent bro ....
Awesome...!!!!
Thanks ✌️
👏👏 👉🔔
The screen recorder and video editor you use what it's name please tell me
I have a doubt :
Can't we just give color to the Power on/off icon in input [type = "checkbox"] :checked without using a separate input [type = "checkbox"] :checked: after ???
Could someone please tell me what is the difference ?
Good very helpful ❤️❤️❤️
It was very practical. Thank you.
Glad it was helpful!
One video make about bottom wave (svg)
help
body{
background-color: #ececec;
padding: 0;
margin:0;
}
input[type="checkbox"]{
height:200px;
width:200px;
/*-webkit-appearance: none;*/
box-shadow:
-10px -10px 15px rgba(255,255,255,0.5),
10px, 10px, 15px, rgba(70,70,70,0.12);
position: absolute;
transform: translate(-50%,-50%);
top:50%;
left:50%;
border-radius: 50%;
border: 8px solid #ececec;
outline: none;
}
if i set the web kit appearence to none the block disappear completely and blend with the background how do i fix it?
That was something wonderful and clean.
Thank you so much for your kind help.
Wow, it's amazing, 🔥
What software are u using for this?
what if you added transition speed? 👌😲
Make a video on nav bars
Sure.
Meanwhile you can check the previous navbar tutorials.
Please can publish the code?, thanks
What do you use for coding
Sublime Text 3. But I personally recommend using VS Code.
Super
Explanation would be great
github?
Can you make video on dark mode Button !?
Mine Doesn't Work.
Du it grea
@@vanessaflores7235 I will try.
Hello guys! Can someone help me buy a computer? I dream of studying programming and becoming a professional programmer. At the moment I am unemployed and cannot afford to buy a computer to start studying programming. If anyone wants to help me, thank you very much!
The Clicking noises are awful
Thank you for the feedback. I don't use them in my videos anymore.