Form by aadium
#212121
1.form { 2 display: flex; 3 align-items: center; 4 flex-direction: column; 5 gap: 10px; 6 background-image: linear-gradient(45deg, #330808, 7 #3a2c09); 8 border-radius: 2.5em; 9 padding: 30px; 10 width: 300px; 11 height: 350px; 12} 13 14.form::before { 15 content: ''; 16 background-image: linear-gradient(45deg, #ff0000, 17 #ffb700); 18 height: 358px; 19 width: 309px; 20 position: absolute; 21 margin-top: -34px; 22 margin-left: px; 23 z-index: -1; 24 border-radius: 2.7em; 25} 26 27.button { 28 margin-top: 10px; 29 font-family: Arial, Helvetica, sans-serif; 30 font-size: 17px; 31 background: #ff5900; 32 color: black; 33 padding: 0.7em 5.5em; 34 display: flex; 35 align-items: center; 36 border: 2px solid #66da4300; 37 border-radius: 5em; 38 overflow: hidden; 39 transition: all 0.2s; 40 cursor: pointer; 41} 42 43.button:hover { 44 border: 2px solid #ff5900; 45 background: #00000000; 46 color: #ff5900; 47} 48 49.button:active { 50 border: 2px solid #66da4300; 51 background: #ff5900; 52 color: black; 53} 54 55.input { 56 width: calc(100% - 10px); 57 padding: 8px; 58 margin-bottom: 20px; 59 border: 1px solid #66da4300; 60 border-bottom: 1px solid #ff5900; 61 outline: none; 62 background-color: transparent; 63 color: #ff5900; 64 font-family: Arial, Helvetica, sans-serif; 65 transition: 0.2s; 66} 67 68.input:focus { 69 border: 1px solid #66da4300; 70 border-bottom: 1px solid #ff5900; 71 background-color: transparent; 72 color: white; 73} 74 75.input::placeholder { 76 color: #9b725b; 77} 78 79.textarea { 80 font-family: Arial, Helvetica, sans-serif; 81 width: calc(100% - 10px); 82 padding: 8px; 83 height: 100px; 84 margin-bottom: 20px; 85 border: 1px solid #66da4300; 86 border-bottom: 1px solid #ff5900; 87 outline: none; 88 background-color: transparent; 89 color: #ff5900; 90} 91 92.textarea::placeholder { 93 color: #9b725b; 94} 95 96.textarea:focus { 97 border: 1px solid #66da4300; 98 border-bottom: 1px solid #ff5900; 99 background-color: transparent; 100 color: white; 101}
2.5K views
2.5K views
MIT License