cssで日の丸を描く方法 - nonbeiのIT備忘録

◆radial-gradient()で描く

・html

<div class="hinomaru1"></div>

・css

.hinomaru1
{
width: 300px;
height: 200px;
background-color: white;
background-image: radial-gradient(circle closest-side,#be003f 60%,transparent 60%);
border: 1px solid;
}

◆border-radiusで描く

・html

<div class="hinomaru2"></div>

・css

.hinomaru2
{
width: 300px;
height: 200px;
background-color: #ffffff;
border: 1px solid;
position: relative;
}
.hinomaru2::before
{
content:"";
display: block;
width: 40%;
height: 60%;
background-color: #be003f;
border-radius: 50%;
position: absolute;
top: 20%;
left: 30%;
}

関連：

正しい日章旗の色について

　昨日は天気も良いので所沢の航空公園まで散歩した。自衛隊機などをぼんやり見ながら、機体の日章旗の色に心惹かれた。いい色合いだなと思った。そう思う背景には、日本の国旗として掲揚される日の丸の色が、どうも間違っているとしか思えないのだ。日の丸掲揚を叫ぶ人たちは、このことをどう考えているのか気になる。もちろん、問えば、つまらない答えが得られるのだろう。そんなことは本質的ではないとか云々。つまり、日章旗を愛でているのではなく、イデオロギーに心酔しているだけなのだ。
　詳細を書くのはめんどくさいので省略するが、日章旗は法律で国旗として規定されるようになった。小渕の残した遺産のようなものだ。私は技術屋の末席くらいにはいたので、なんであれスペック（仕様）が気になる。日章旗は国旗及び国歌に関する法律の別記で次のように決められている。

日章旗の制式
（図省略）
一　寸法の割合及び日章の位置
　縦　横の三分の二
　　　　日章
　　　　直径　　縦の五分の三
　　　　中心　　旗の中心
二　彩色
　　　　地　　　白色
　　　　日章　　紅色
　歴史好きのものからしてみると、日章がやや大きいかなという印象はある。それでも明治3年1月27日太政官布告第59号では十分の七だった。が、それはそれでいいだろうとは思う（日章が本質だから）。白地もさして問題はない。問題は日章の彩色である。「紅色」とある。これは太政官布告第59号を踏襲している。つまり、戦前戦後で日章の色に違いはないはずだ。
　当然ながら、「紅色」というのは曖昧な色ではない。工業的な色彩はJISで決められている。"JIS Z 8102(2001)"「物体色の色名」である。色はマンセル体系で規定されていて、"3R4/14"である。パソコンで再現するにはこれをRGB値に変換しなくてはいけないのだが、この変換式が各人各様といった状況のようだ。モニターの基準によるのだろう。マンセル規格の大元の団体でもRGB値の変換プログラムを配布しているのだが、日本で普及しているモニターだとやや色合いが違う。日本ではシェアウエア「色出し名人」（参照）が普及しているようだが、これだと"BE003F"である。
●
ソ－ス：color:#BE003F
　まぁだいたい自衛隊機の日の丸の色に近い。というか、これが日章旗の色のはずなのだが、まずもって、日常見かける日章旗でこの色を見たことがない。まったく日本人の色彩感覚はどうしちまったのだろうと思う。
　今朝の産経新聞社説「国旗・国歌　正面に掲げ堂々と歌おう」である。またかよであるが、こう言う。

　まもなく卒業式のシーズンである。どの学校でも、国旗を正しく掲揚し、心をこめて国歌を斉唱する。そんなすがすがしい厳粛な卒業式が行われることを願いたい。
　「国旗を正しく掲揚」する前に、「正しい国旗」を掲揚してほしいものだなと思う。
　なにか些細なことを論じていると思われる人も多いかもしれないが、英霊を乗せた軍機の日の丸の色は、現在の自衛隊機の色と同じである。軍機の展示を見て、その日章の色がくすんでいるように思うような日本人がいては情けないではないか。
追記
広辞苑の電子版を持っているのを思い出し、そこで紅色をひいてみた。マンセル系は同じだが、RGB値が違う。次のようになっていた。こちらのほうが実際に近い。
●
ソ－ス：color:#a51431
法制化にあたり、しょーもない議論の記録があった。こんなのを理由に曖昧な色合いとされてはたまらんなと思う。

第145回国会　内閣委員会　第11号（平成11年7月1日（木曜日））

竹島政府委員　紅色というふうに書いてありまして、赤とは書いていないということについてお答え申し上げます。
　一つは、赤とした場合には、白に近い赤から黒に近い赤まで、赤という色の意味する範囲が広い。それに対しまして、日章旗の日の丸の色というのは御案内のとおり鮮やかな赤。その鮮やかな赤ということを意味するために、赤色ではなくて紅色ということで特定性をより正確にしよう、こういうことで紅色という表現にさせていただいております。
145回-参-本会議-43号 1999/08/09
山崎力
　むしろ、法案の中に日の丸の色を赤色ではなく紅色とあるのを見て、違和感すら覚えました。確かに、一般的に流布されている日章旗の色自体は紅かもしれません。しかし、紅色は広く赤色の系統に含まれるものですが、逆に、紅色は赤色系全体を示すことはできません。何より広く国民に浸透している赤のイメージを覆すものであり、同僚議員が異例にも特別委員会で独唱した「白地に赤く」との歌詞は、正確には間違いということになってしまいます。

via:正しい日章旗の色について: 極東ブログ

・コードで自由に図形を描ける <svg>がある

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
<circle cx="150" cy="200" r="100" fill="#BE003F"></circle>
</svg>