【CSS小ネタ】radialなドッグイヤーもどき - Little Strange Software

どうも！LSSです！！ CSSで表現されるものに「ドッグイヤー」と呼ばれるものがあります。 ちょうど紙の角を少し、45度に折ったような表現で、使われている例もCSSコードもあちこちで見かけます。 今回は「ピシッと折ったドッグイヤーではなく、ふんわりめくれたような表現」をradial-gradientで考えてみました。 ドッグイヤーもどき コード 欠点と対処法 ドッグイヤーもどき ドッグイヤーもどき コード <style> .dogy{ width:280px; height:280px; padding:10px; background-image: conic-gradient(from 180deg,#eeeedd 0deg 270deg,#eeeedd00 271deg), radial-gradient(50% 30%,#eeeedd 99%,#eeeedd00 100%), ra

[conasaji]

ちょっとしたポイントに良いですね。カタカタに次ぐ人気作になりそう。

[kefugahi]

ドッグイヤーですか。なるほど。わんこの耳は結構表情が出るのです。

[newgenworld]

おはようございます☁✨付箋みたいですね😃

[hukunekox]

めくれちゃう、めくれちゃうww🤣