Discover 45+ creative CSS examples to style your input fields and make your forms pop.
1. Fancy Text Inputs by Alex Bergin
Author: Alex Bergin
Links: Source Code / Demo
Made with: HTML CSS
2. Google Material Design Input Boxes by Chris on Code
Author: Chris on Code
Links: Source Code / Demo
Made with: HTML CSS
3. Modern Style Input Text by Alexander Erlandsson
Author: Alexander Erlandsson
Links: Source Code / Demo
Made with: HTML CSS
4. Minimal Material Design Form Input by Kyle Lavery
Author: Kyle Lavery
Links: Source Code / Demo
Made with: HTML CSS
5. CSS Fields by Stas Melnikov
Author: Stas Melnikov
Links: Source Code / Demo
Made with: HTML CSS
6. Input Group :focus-within by Aaron Iker
Author: Aaron Iker
Links: Source Code / Demo
Made with: HTML CSS
7. Custom Styled Inputs by S G
Author: S G
Links: Source Code / Demo
Made with: HTML CSS
8. Email Input Field by Dean Hidri
Author: Dean Hidri
Links: Source Code / Demo
Made with: HTML CSS
9. WordPress Login Concept by Håvard Brynjulfsen
Author: Håvard Brynjulfsen
Links: Source Code / Demo
Made with: HTML CSS
10. Input Field Gradient Border Focus Fun by Rik Schennink
Author: Rik Schennink
Links: Source Code / Demo
Made with: HTML CSS
11. CSS3 Input Text/Password Animation by brayden cha
Author: brayden cha
Links: Source Code / Demo
Made with: HTML CSS
12. Jumping Input Text by Niklesh Tiwane
Author: Niklesh Tiwane
Links: Source Code / Demo
Made with: HTML CSS
13. Animated Input Labels by Ziafat Ali
Author: Ziafat Ali
Links: Source Code / Demo
Made with: HTML CSS
14. Adaptive Placeholder by Danny King
Author: Danny King
Links: Source Code / Demo
Made with: HTML CSS
15. Input Animation CSS by webcrafters
Author: webcrafters
Links: Source Code / Demo
Made with: HTML CSS
16. Input with gradient-border by Nils Binder
Author: Nils Binder
Links: Source Code / Demo
Made with: HTML CSS
17. Search Input Caret Jump by Jon Kantner
Author: Jon Kantner
Links: Source Code / Demo
Made with: HTML CSS
18. CSS Input Focused Animation by Danian
Author: Danian
Links: Source Code / Demo
Made with: HTML CSS
19. Form Label Show After Input Text Only CSS by Fidalgo
Author: Fidalgo
Links: Source Code / Demo
Made with: HTML CSS
20. Input Icon W Focus Effect by UbaidRussell
Author: UbaidRussell
Links: Source Code / Demo
Made with: HTML CSS
21. HTML And CSS Only Login Form With Tabs And Simple Input Animation by Yor
Author: Yor
Links: Source Code / Demo
Made with: HTML CSS
22. Form Input Design by Mahesh
Author: Mahesh
Links: Source Code / Demo
Made with: HTML CSS
23. Elastic Validation [Google Chrome] by Andreas Storm
Author: Andreas Storm
Links: Source Code / Demo
Made with: HTML CSS
24. Input Field With Underline Under Each Character by Ana Tudor
Author: Ana Tudor
Links: Source Code / Demo
Made with: HTML CSS
25. CSS Input Text Box by Aditya Bhandari
Author: Aditya Bhandari
Links: Source Code / Demo
Made with: HTML CSS
26. Material Design Input Text by Ben Mildren
Author: Ben Mildren
Links: Source Code / Demo
Made with: HTML CSS
27. Notify Me by bertdida
Author: bertdida
Links: Source Code / Demo
Made with: HTML CSS
28. Neumorphic Inset Input by Alex Sommers
Author: Alex Sommers
Links: Source Code / Demo
Made with: HTML CSS
29. CSS Vars Styling by David A.
Author: David A.
Links: Source Code / Demo
Made with: HTML CSS
30. Combobox by Shannon Moeller
Author: Shannon Moeller
Links: Source Code / Demo
Made with: HTML CSS
31. input:not(:placeholder-shown) by Andreas Storm
Author: Andreas Storm
Links: Source Code / Demo
Made with: HTML CSS
32. CSS Only Floated Labels by Nick Salloum
Author: Nick Salloum
Links: Source Code / Demo
Made with: HTML CSS
33. Text Input Love by Michael Arestad
Author: Michael Arestad
Links: Source Code / Demo
Made with: HTML CSS
34. Material Input Text Fields by Fatma
Author: Fatma
Links: Source Code / Demo
Made with: HTML CSS
35. Nice, Compliant Input Boxes by Andrew Tunnecliffe
Author: Andrew Tunnecliffe
Links: Source Code / Demo
Made with: HTML CSS
36. Animation Inputs With HTML CSS / Hover Gradient by Ruben Vardanyan
Author: Ruben Vardanyan
Links: Source Code / Demo
Made with: HTML CSS
37. Webflow-Style Email Input by Phil Rose
Author: Phil Rose
Links: Source Code / Demo
Made with: HTML CSS
38. Input Icon W Focus Effect by UbaidRussell
Author: UbaidRussell
Links: Source Code / Demo
Made with: HTML CSS
39. Pure CSS Authentication by Jhey
Author: Jhey
Links: Source Code / Demo
Made with: HTML CSS
40. CSS Editable Letter Board by Anyssa Ferreira
Author: Anyssa Ferreira
Links: Source Code / Demo
Made with: HTML CSS
41. Aks İnput by Ahmet Aksungur
Author: Ahmet Aksungur
Links: Source Code / Demo
Made with: HTML CSS
42. 3D Textbox by Jouan Marcel
Author: Jouan Marcel
Links: Source Code / Demo
Made with: HTML CSS
43. Form Group Search Css by Fauzan Ahmad
Author: Fauzan Ahmad
Links: Source Code / Demo
Made with: HTML CSS
44. Playing With Inputs by savwiley
Author: savwiley
Links: Source Code / Demo
Made with: HTML CSS
45. CSS-only Material Inputs by Lewis Robinson
Author: Lewis Robinson
Links: Source Code / Demo
Made with: HTML CSS
