円錐状のグラデーションを描写するconic-gradient。conicはconicalのことだそうです。コーヒーミルの種類にコニカルカッターってありますけど、あのコニカルですね。
何気なくCan I Useで確認したらいつの間にかfirefoxも対応しており、モダンブラウザ最新版なら使用OKになってました。
我が家の古いAndoroid（5.0）でも表示確認できたので、ブラウザバージョンが古いまま放置しているユーザー以外ならpolifilなしでも大丈夫だと思います。（IEが対応していないのは言うまでもありません。）
そこで基本的なconic-gradientの説明記事を残しておこうと思います。
円錐グラデーション
円錐状のグラデーションをいわれて、ぱっと想像できる人とそうでない人がいると思うので、最初にシンプルなサンプルを。
div {
background: conic-gradient(navy, tomato, orange);
border-radius: 50%;
}
（もし真っ黒な円が表示されていたら非対応ブラウザか、更新していないブラウザです）
サンプルの通り、始点からぐるっと時計回りのグラデーションを描写します。
linear-gradientやradial-gradientと同じく、開始位置と終了位置を指定することで塗りつぶしの描写も可能です。
div {
background: conic-gradient(navy 0 120deg, tomato 120deg 240deg, orange 240deg );
border-radius: 50%;
}
位置指定をdeg( = degree =角度)で行っていますが、これについては次の項目で説明します。
設定できるオプション値
conic-gradientでは、色以外に中心位置と開始位置を定めることができます。初期値は中心位置が「center」。開始位置は0時の方向です。構文は次のようになります。
*{
background-image: conic-gradient( from [開始位置] at [中心位置] , 色1,色2,。。);
}
位置はdeg または grad または rad またはturn で指定
turn はlinear-gradientでも説明したことがありますが、conic-gradientでもrad（ラジアル） grad（グラデーション）など色々な単位が登場してきます。
radとgradなんて間違い頻発しそうですし、わざわざ全部覚えておく必要はないのでdegで説明します。角度なので一周360度です。始点が0degとなり時計回りに360degまで。
先程のサンプルは3分の１ずつ区切るので、色の開始位置/終了位置を、0 / 120deg ・120deg / 240deg ・ 240deg / 360deg として３分割しています。
試しにdegの代わりに%指定してみても同じ結果が表示できましたが、％指定は仕様にない使い方なので無難にdegで覚えておくほうが良いでしょう。
開始位置は from [位置]
たとえば開始位置を右上からにしようと思えばfrom 45deg, です。
div {
background: conic-gradient( from 45deg, navy 0 120deg, tomato 120deg 240deg, orange 240deg);
border-radius: 50%;
}中心位置は at [position型]
中心の位置はbackground-position などと同じで、キーワード（top、center など）やpx指定、％指定が可能です。当然ですが、中心位置を要素の端に指定した場合（top left right bottom）、グラデーションの半分は表示されません。
at [中心位置]とします。下のサンプルはat 50% 30%に指定。
指定する順番に注意
Firefoxでしか検証してませんが、from と at を逆に書くとエラーが出ます。from [開始位置] at [中心位置] , [色] の順番を守りましょう。 オプションと色の間にカンマも忘れずに。
繰り返し表示はrepeating-conic-gradient
これもlinear- radial- と同様に、繰り返しグラデーションの表示にはrepeating-conic-gradientを使います。
下はconic-gradientのサンプルです。
See the Pen conical gradient by Takashi Abe (@TakeshiAbe) on CodePen.
↑ 虹色コニカルグラデーションの上にパックマンみたいなコニカルグラデーション（css animationで回転）
↓ パックマンみたいと思ったので、conic-gradientでパックマン作りました。
See the Pen PACK MAN by Takashi Abe (@TakeshiAbe) on CodePen.
