Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
SASS CSS Arrows - Up Down Left Right - via border
=arrow-up($color: rgba(white, .50), $size: 5px)
width: 0
height: 0
border-left: $size solid transparent
border-right: $size solid transparent
border-bottom: $size solid $color
=arrow-down($color: rgba(white, .50), $size: 5px)
width: 0
height: 0
border-left: $size solid transparent
border-right: $size solid transparent
border-top: $size solid $color
=arrow-right($color: rgba(white, .50), $size: 5px)
width: 0
height: 0
border-top: $size solid transparent
border-bottom: $size solid transparent
border-left: $size solid $color
=arrow-left($color: rgba(white, .50), $size: 5px)
width: 0
height: 0
border-top: 10px solid transparent
border-bottom: 10px solid transparent
border-right: 10px solid $color
@willbowling

This comment has been minimized.

Copy link
Owner Author

commented Apr 8, 2014

usage:

.arrow-down
  +arrow-down($color: silver, $size: 15)

or

  +arrow-down($color: silver)

or

  +arrow-down(silver, 15)

<div class="arrow-down"></div>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.