Throw Your Letters – A Fantastic Input Effect with JS & CSS

Today’s inspiration is coming from Maneesh Chiba, a multimedia designer from Johannesburg, South Africa. He likes to experiment with code and creates bold and eye-catchy designs.

Throw your letters is a lovely JS & CSS experiment that will transform an ordinary input field to an entertaining one. The idea is when you type in the input field, the same letters that you typed in start to jump and dance around the screen.

Don’t struggle alone with projects

Join the creative community of UX, graphic and web designers and developers to get help with any design or dev project.

Some would argue if this effect is needed as it is distracting and not useful but I believe that such experiments (solutions) are quite enriching for the web experience and on certain projects such effects can be quite beneficial in children websites or ones where the user needs to focus on information that is typed.

Here is the effect itself. Type in to see it action. A copy of this snippet is available for download below.

See the Pen Throw your letters by Maneesh (@maneeshc) on CodePen.

Download Throw Your Letters Snippet

Related post:  Everything is a Remix Part 4
Divi WordPress Theme

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.