Compassでのグラデーション指定について。
IEについては７〜10まで確認済み。

よくある垂直・2色のグラデーションです。

style.scss


// SVG指定も出力するように(IE9用)
$experimental-support-for-svg: true;

// 色を登録しておくよ
$bottomColor:	#3b5998;
$topColor:		lighten($bottomColor, 10%);

// グラデーションを指定するよ
.button {
	background: $bottomColor;
	@include background-image(linear-gradient(top, $topColor, $bottomColor));
	@include filter-gradient($topColor, $bottomColor, vertical);
}

出力されるCSSはこちら

style.css


.button {
	background: #3b5998;
	background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRjNzBiYSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzNiNTk5OCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
	background-size: 100%;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4c70ba), color-stop(100%, #3b5998));
	background-image: -webkit-linear-gradient(top, #4c70ba, #3b5998);
	background-image: -moz-linear-gradient(top, #4c70ba, #3b5998);
	background-image: -o-linear-gradient(top, #4c70ba, #3b5998);
	background-image: linear-gradient(top, #4c70ba, #3b5998);
	*zoom: 1;
	filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF4C70BA', endColorstr='#FF3B5998');
}