CodeMyUI

Blast text

A Pen by Saijo George on CodePen.

License.

CodeMyUI

<section>
    <form>
        <input type="text" placeholder="Email">
        <button type="submit" class="btn first">
            <img src="https://alikinvv.github.io/subscription-animation/build/mail.svg" alt="">
            <span class="start">GET A PROMO CODE</span>
            <span class="done">THANK YOU!</span>
        </button>
    </form>
</section>

CodeMyUI

#app
	zz-button-progress(
		text="Upload",
		ref="zzUpload",
		v-on:progress="moveProgress"
		v-on:progress-finished="endProgress"
	)

CodeMyUI

#wrap
 .field
 .plunger
  .rod
 %form.signup
  %input.email{:type => "email"}/
  .btnwrap
   -6.times do
    .spark
   %b{"data-splitting" => "chars"} Subscribe

CodeMyUI

<div class="overflow">
  
<div id="play-button-container">
  
<svg id="button-circle-svg" viewBox="0 0 100 100">
  <style type="text/css">	
    .st0 { 
      fill: #DDDDDD;
      stroke:#010101;
      stroke-width: 0px;

CodeMyUI

Gradient Ordered List

A simple, styled ordered list using SCSS and HTML5. The gradient background transitions from one, to another, and back again. IE11 friendly.

A Pen by Erin E. Sullivan on CodePen.

License.

CodeMyUI

Cool CSS Underline Effects

Cool underlines effects done entirely w/ CSS Gradients. No images or JS.

A Pen by Jordan Marshall on CodePen.

License.

CodeMyUI

Animated Verbs II

A second take on animating characters in verbs to represent their action. Leave a comment if there's a word you'd like to see added and animated on this list.

Part one: https://codepen.io/hexagoncircle/pen/MWgbqON
Part three: https://codepen.io/hexagoncircle/pen/oNvMLRQ

A Pen by Ryan Mulligan on CodePen.

License.

CodeMyUI

Click the button!

You tell me..

A Pen by Bård N Hovde on CodePen.

License.

CodeMyUI

Egg Toggle Switch Morph 🍳 => 🥚

Made using SVG morphing technique. Inspired by a Dribbble shot: https://dribbble.com/shots/7190248-Toggle

A Pen by Kiarash Zarinmehr on CodePen.

License.