Seeking Guidance on Button Design: Photo and CodePen Link Provided

I have a question regarding the button I've shared a photo of. Could you please let me know how it looks? Additionally, I'm sharing the codepen link to show how I've approached creating this button. Can you guide me if there's an easier way to achieve the design shown in the photo? https://codepen.io/Amit-Soni-the-vuer/pen/VwNeWbj
No description
8 Replies
Tok124 (CSS Nerd)
Tok124 (CSS Nerd)β€’9mo ago
This is how i would do it https://codepen.io/tok124/pen/jORWRob
Tim
CodePen
jORWRob
...
amitsoni
amitsoniOPβ€’9mo ago
Thank you; it would serve as an excellent reference for me. I have a few difficulties as well, could you guide me through them? I have an input field similar to this and would like to achieve the same gradient effect. Additionally, I want to apply this gradient effect to a checkbox. Could you provide guidance on that as well? I'm sharing the code pen link and a photo to illustrate how it looks. https://codepen.io/Amit-Soni-the-vuer/pen/zYXrRqR
Amit Soni
CodePen
input
...
No description
No description
Tok124 (CSS Nerd)
Tok124 (CSS Nerd)β€’9mo ago
i can fix the checkbox now πŸ™‚ Here you have the checkbox example https://codepen.io/tok124/pen/LYvGKYw
amitsoni
amitsoniOPβ€’9mo ago
Thank you for your help in fixing both the input and checkbox. I've provided photos of the checkbox and input field, along with the code. Despite my attempts, I couldn't succeed. Your assistance would be greatly appreciated. Thank you.😊😊
amitsoni
amitsoniOPβ€’9mo ago
Last one thing have you reviewed my codepen link give me suggestions on thai if better way of achieving is possible. Thank you ☺️ https://codepen.io/Amit-Soni-the-vuer/pen/zYXrRqR
Amit Soni
CodePen
input
...
Tok124 (CSS Nerd)
Tok124 (CSS Nerd)β€’9mo ago
I will take a look soon. I have to go to the store and stuff first. But you should be able to apply most of the stuff from the checkbox code to get the effect you want on the input πŸ™‚
Tok124 (CSS Nerd)
Tok124 (CSS Nerd)β€’9mo ago
@amitsoni I am back from the store. Here is how i would make the text input https://codepen.io/tok124/pen/xxeZomw
Tim
CodePen
xxeZomw
...
amitsoni
amitsoniOPβ€’9mo ago
Thank you ☺️
Want results from more Discord servers?
Add your server