Подборка очень красивых градиентов для оформления ссылок.

a:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
} 
a.color_1:before {
  opacity: 0.6;
  background: #410cbc;
  background: -moz-linear-gradient(20deg, #410cbc 0%, #ff6f31 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #410cbc), color-stop(100%, #ff6f31));
  background: -webkit-linear-gradient(20deg, #410cbc 0%, #ff6f31 100%);
  background: -o-linear-gradient(20deg, #410cbc 0%, #ff6f31 100%);
  background: -ms-linear-gradient(20deg, #410cbc 0%, #ff6f31 100%);
  background: linear-gradient(20deg, #410cbc 0%, #ff6f31 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#410cbc', endColorstr='#ff6f31', GradientType=1);
}
a.color_2:before {
  opacity: 0.6;
  background: #f4880d;
  background: -moz-linear-gradient(20deg, #f4880d 0%, #70ff99 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #f4880d), color-stop(100%, #70ff99));
  background: -webkit-linear-gradient(20deg, #f4880d 0%, #70ff99 100%);
  background: -o-linear-gradient(20deg, #f4880d 0%, #70ff99 100%);
  background: -ms-linear-gradient(20deg, #f4880d 0%, #70ff99 100%);
  background: linear-gradient(20deg, #f4880d 0%, #70ff99 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4880d', endColorstr='#70ff99', GradientType=1);
}
 a.color_3:before {
  opacity: 0.6;
  background: #c40f79;
  background: -moz-linear-gradient(20deg, #c40f79 0%, #7ebfff 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #c40f79), color-stop(100%, #7ebfff));
  background: -webkit-linear-gradient(20deg, #c40f79 0%, #7ebfff 100%);
  background: -o-linear-gradient(20deg, #c40f79 0%, #7ebfff 100%);
  background: -ms-linear-gradient(20deg, #c40f79 0%, #7ebfff 100%);
  background: linear-gradient(20deg, #c40f79 0%, #7ebfff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c40f79', endColorstr='#7ebfff', GradientType=1);
}
 a.color_4:before {
  opacity: 0.6;
  background: #0016be;
  background: -moz-linear-gradient(20deg, #0016be 0%, #2aec74 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #0016be), color-stop(100%, #2aec74));
  background: -webkit-linear-gradient(20deg, #0016be 0%, #2aec74 100%);
  background: -o-linear-gradient(20deg, #0016be 0%, #2aec74 100%);
  background: -ms-linear-gradient(20deg, #0016be 0%, #2aec74 100%);
  background: linear-gradient(20deg, #0016be 0%, #2aec74 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0016be', endColorstr='#2aec74', GradientType=1);
}
 a.color_5:before {
  opacity: 0.6;
  background: #023c8c;
  background: -moz-linear-gradient(20deg, #023c8c 0%, #ff86d3 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #023c8c), color-stop(100%, #ff86d3));
  background: -webkit-linear-gradient(20deg, #023c8c 0%, #ff86d3 100%);
  background: -o-linear-gradient(20deg, #023c8c 0%, #ff86d3 100%);
  background: -ms-linear-gradient(20deg, #023c8c 0%, #ff86d3 100%);
  background: linear-gradient(20deg, #023c8c 0%, #ff86d3 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#023c8c', endColorstr='#ff86d3', GradientType=1);
}
 a.color_6:before {
  opacity: 0.6;
  background: #00ac81;
  background: -moz-linear-gradient(20deg, #00ac81 0%, #ff778e 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #00ac81), color-stop(100%, #ff778e));
  background: -webkit-linear-gradient(20deg, #00ac81 0%, #ff778e 100%);
  background: -o-linear-gradient(20deg, #00ac81 0%, #ff778e 100%);
  background: -ms-linear-gradient(20deg, #00ac81 0%, #ff778e 100%);
  background: linear-gradient(20deg, #00ac81 0%, #ff778e 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ac81', endColorstr='#ff778e', GradientType=1);
}
 a.color_7:before {
  opacity: 0.6;
  background: #007808;
  background: -moz-linear-gradient(20deg, #007808 0%, #fff940 100%);
  background: -webkit-gradient(left bottom, right top, color-stop(0%, #007808), color-stop(100%, #fff940));
  background: -webkit-linear-gradient(20deg, #007808 0%, #fff940 100%);
  background: -o-linear-gradient(20deg, #007808 0%, #fff940 100%);
  background: -ms-linear-gradient(20deg, #007808 0%, #fff940 100%);
  background: linear-gradient(20deg, #007808 0%, #fff940 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#007808', endColorstr='#fff940', GradientType=1);
}

0 комментариев

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *