https://tympanus.net/Development/TextInputEffects/
Related: acyianInspiration for Custom Select Elements Pick your color #588c75#b0c47f#f3e395#f3ae73#da645a#79a38f#c1d099#f5eaaa#f5be8f#e1837b#9bbaab#d1dcb2#f9eec0#f7cda9#e8a19b#bdd1c8#e1e7cd#faf4d4#fbdfc9#f1c1bd If you enjoyed this demo you might also like: Multi-Level Menu Drop-Down List Effects Linkedin, social icon SVG - Base64 PNG - Base64 Help License: Creative Commons (Attribution-Share Alike 3.0 Unported) (help for licenses) Additional sizes Typicons - 308 vector (SVG) icons View all icons in icon set 1 comment Hover.css - A collection of CSS3 powered hover effects All Hover.css effects make use of a single element (with the help of some pseudo-elements where necessary), are self contained so you can easily copy and paste them, and come in CSS, Sass, and LESS flavours. Many effects use CSS3 features such as transitions, transforms and animations. Old browsers that don't support these features may need some extra attention to be certain a fallback hover effect is still in place. Licenses Hover.css is made available under a free personal/open source or paid commercial licenses depending on your requirements.
Quantity Queries for CSS Don’t you just hate documentaries that don’t deliver? They have enticing names like In Search of the Giant Squid, and tease you with shots of murky underwater shapes and excited scientists pointing far out to sea. You settle down to watch, eyes narrowed with suspicion, thinking, “I better see some squid or I’m writing an angry letter to the network.” Article Continues Below
Text animated with JavaScript & anime.js Source <h1 class="ml1"><span class="text-wrapper"><span class="line line1"></span><span class="letters">THURSDAY</span><span class="line line2"></span></span></h1> <h1 class="ml2">Sunny mornings</h1> <h1 class="ml3">Great Thinkers</h1> <h1 class="ml4"><span class="letters letters-1">Ready</span><span class="letters letters-2">Set</span><span class="letters letters-3">Go!
CSS3 Border-Image Explained One of the more powerful new CSS properties, border-image is also one of the best supported, with the exception of (all together now) IE10 and earlier. It is, unfortunately, also one of the most obtuse and difficult to understand. The explanation of how border-image works is perhaps best illustrated graphically. Iconic: Advanced icons for the modern web by Waybury Want to dig right in? Check out our examples: Whether you know it or not, you've probably seen Iconic. 26 CSS Hover Effects Collection of hand-picked free HTML and CSS hover effect code examples: animations, transitions, etc. Update of July 2017 collection. 8 new items. Author Alex Carpenter Made with HTML / CSS (SCSS) / JavaScript (Babel) Stampede Blog - Responsive Bootstrap Push Menu Tutorial Getting bored with the current responsive Bootstrap menu? Or you simply don't want to use Bootstrap 3 dropdown menu on mobile because the menu is just too tall? Bootstrap 3 Mobile Menu
Coder's Block Blog / Checkbox Trickery with CSS Checkboxes are great. Combine them with the right CSS and you can pull off some really neat tricks. This article aims to showcase some of the creative things you can do with checkboxes. Read on and keep in mind that the demos in this article use no JavaScript. Tab Styles Inspiration Previous Demo Back to the Codrops Article Re-created from Vintage Productions Technique from Slanted tabs with CSS 3D transforms by Lea Verou If you enjoyed this demo you might also like: Arrow Navigation Styles Dot Navigation Styles