Swiper.jsのナビゲーションの色を変える

検索しても解決方法が見つからなかったので､メモ

ナビゲーションの色とナビゲーションボタンのサイズを変更しています｡

.swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 27 44'%3E%3Cpath d='M0,22L22,0l2.1,2.1L4.2,22l19.9,19.9L22,44L0,22L0,22L0,22z' fill='%233f3f3f'%2F%3E%3C%2Fsvg%3E");
    background-size: 13.5px 22px;
}

@media (max-width: 600px) {
    .swiper-button-prev {
        background-size: 22px 44px;
    }
}

.swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 27 44'%3E%3Cpath d='M27,22L27,22L5,44l-2.1-2.1L22.8,22L2.9,2.1L5,0L27,22L27,22z' fill='%233f3f3f'%2F%3E%3C%2Fsvg%3E");
    background-size: 13.5px 22px;
}

@media (max-width: 600px) {
    .swiper-button-next {
        background-size: 22px 44px;
    }
}

fill='%233f3f3f'

3f3f3fは16進数カラーコードです。これをデコードすると、#3f3f3fとなります。このカラーコードは暗い灰色（ダークグレー）となります｡
とりあえず､ここでカラー指定すれば変更できました｡

参考