WEBLEB
Home
Editor
Login
Pro
English
English
Français
Español
Português
Deutsch
Italiano
हिंदी
HTML
CSS
JS
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>Simple Input Field HTML CSS</title> <link rel="stylesheet" href="css/styles.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css" /> </head> <body> <input placeholder="Username" class="input" name="text" type="text"> </body> </html>
body{ font-family: 'Inter', sans-serif; overflow: hidden; background-color: #171717; display: flex;justify-content: center; align-items: center; height: 100vh; } .input { margin: 30px; background: none; border: none; outline: none; max-width: 190px; padding: 10px 20px; font-size: 16px; border-radius: 9999px; box-shadow: inset 2px 5px 10px rgb(5, 5, 5); color: #fff; }
/* Replace with your JS Code (Leave empty if not needed) */
Validating your code, please wait...
HTML
CSS
JS
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>Simple Input Field HTML CSS</title> <link rel="stylesheet" href="css/styles.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css" /> </head> <body> <input placeholder="Username" class="input" name="text" type="text"> </body> </html>
body{ font-family: 'Inter', sans-serif; overflow: hidden; background-color: #171717; display: flex;justify-content: center; align-items: center; height: 100vh; } .input { margin: 30px; background: none; border: none; outline: none; max-width: 190px; padding: 10px 20px; font-size: 16px; border-radius: 9999px; box-shadow: inset 2px 5px 10px rgb(5, 5, 5); color: #fff; }
/* Replace with your JS Code (Leave empty if not needed) */