Css Editable Letter Board

16.09.2020

Made with: HTML,CSS (SCSS)

View Code

Css Editable Letter Board

Css Vars Styling

9.09.2020

CSS vars styling for <input type="text" />.

Made with: HTML,CSS (SCSS)

View Code

Css Vars Styling

Combobox

16.06.2020

A fixed list combo box is when a user can type a certain string, and there is a list of strings that is designed to help the user arrive at a value. Try it out!

Made with: HTML,CSS

View Code

PlaceholderCombobox

Pure Css Authentication

30.04.2020

Made with: HTML (Pug),CSS (Stylus)

View Code

PlaceholderPure Css Authentication

3D Textbox

17.12.2019

3D textbox form input box. It uses transform: rotate for the sides and for the overall rotation.

Made with: HTML (Pug),CSS (Sass)

View Code

Placeholder3D Textbox

Input Text

7.10.2019

Input text material with gradient.

Made with: HTML,CSS (SCSS)

View Code

PlaceholderInput Text

Input Group

15.08.2019

Input group :focus-within.

Made with: HTML,CSS (SCSS),JS

View Code

PlaceholderInput Group

Material Input Text Fields

14.08.2019

Made with: HTML,CSS

View Code

PlaceholderMaterial Input Text Fields

Jumping Input Text

14.01.2019

Made with: HTML,CSS

View Code

PlaceholderJumping Input Text

Form Label Show After Input Text

9.12.2018

Form label show after input text only CSS.

Made with: HTML,CSS

View Code

PlaceholderForm Label Show After Input Text

Notify Me

15.10.2018

Form validation using HTML required and pattern attributes together with CSS :required and :valid selectors.

Made with: HTML,CSS (SCSS)

View Code

PlaceholderNotify Me

Elastic Validation

20.07.2018

Made with: HTML,CSS (Stylus)

View Code

PlaceholderElastic Validation

Input:Not(:Placeholder-Shown)

15.06.2018

It looks kinda similar to the text inputs of the framework Materialize.

Made with: HTML,CSS (Stylus)

View Code

Input:Not(:Placeholder-Shown)

Form Input Design

24.01.2018

Form input designs with hover and focus.

Made with: HTML

View Code

Form Input Design

Input Field Gradient Border Focus Fun

12.12.2017

A gradient border on an input field that feathers out when focussed.

Made with: HTML

View Code

Input Field Gradient Border Focus Fun

Css Only Floated Labels

27.09.2017

A CSS only approach to the floated labels UI pattern.

Made with: HTML

View Code

Css Only Floated Labels

Css Fields

17.06.2017

Fields with CSS custom properties.

Made with: HTML

View Code

Css Fields

Input Field With Underline Under Each Character

15.01.2017

Made with: HTML,CSS (SCSS)

View Code

PlaceholderInput Field With Underline Under Each Character

Email Input Field

28.09.2016

Just a nice little input field.

Made with: HTML,CSS (SCSS)

View Code

Email Input Field

Css-Only Material Inputs

25.06.2016

Inspired by Google's Material Design guidelines for text fields.

Made with: HTML (Pug),CSS (SCSS)

View Code

PlaceholderCss-Only Material Inputs