Go Pro Sign Up Login
0 days 0 hrs 0 min 0 sec

Summer Sale

50% off Level Up Pro until you unsubscribe.
Get access to ALL 128 courses on Level Up Tutorials

This is your last chance to get Level Up Pro for $145/year.

or Learn More
Moon Moon

Buy Now and unlock this series

$

39

.99

$

24

.99

yours forever

Become a Pro and unlock everything

$

24

.99

per month

Creating A Reusable Icon Component

In this video, we’re going to improve our close button and make it look more appealing by turning it into an SVG icon. You’ll be learning how to write your own Icon component.

Close Icon

<svg
   x="0px"
   y="0px"
  width="24px"
  height="24px"
  viewBox="0 0 31.11 31.11"
  enableBackground="new 0 0 31.11 31.11"
>
  <polygon
    fill="#000"
    points="31.11,1.41 29.7,0 15.56,14.14 1.41,0 0,1.41 14.14,15.56 0,29.7 1.41,31.11 15.56,16.97   29.7,31.11 31.11,29.7 16.97,15.56 "
  />
</svg>

Downloads

Become a pro to download code and videos

Comments

User avatar

Doug MacMillan

almost 3 years ago

Really enjoying this one Scott, thanks. Good pace and clear explanations. Fun too.

Want to join the conversation?

Become a Pro member today!