コピペしちゃって!意外とよく使う丸囲み文字や記号などの特殊文字一覧

CSS HTML
 2018.02.11
 2018.03.12

Web制作をしていると意外とよく使う丸囲み文字や記号などの特殊文字。
数値参照は10進数・16進数を。ついでにcssの擬似要素に使用する場合の「\(バックスラッシュ)」もご用意。

cssの擬似要素に使用する場合は数値参照16進数の「&#x」を「\(バックスラッシュ)」に変更すれば表示されます。
browser:  65 11 20 10 

意外とよく使う丸囲み文字や記号など

丸囲み数字

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
⓪⓪\24ea
①①\2460
②②\2461
③③\2462
④④\2463
⑤⑤\2464
⑥⑥\2465
⑦⑦\2466
⑧⑧\2467
⑨⑨\2468
⑩⑩\2469
⑪⑪\246a
⑫⑫\246b
⑬⑬\246c
⑭⑭\246d
⑮⑮\246e
⑯⑯\246f
⑰⑰\2470
⑱⑱\2471
⑲⑲\2472
⑳⑳\2473
❶❶\2776
❷❷\2777
❸❸\2778
❹❹\2779
❺❺\277a
❻❻\277b
❼❼\277c
❽❽\277d
❾❾\277e
❿❿\277f
⓫⓫\24eb
⓬⓬\24ec
⓭⓭\24ed
⓮⓮\24ee
⓯⓯\24ef
⓰⓰\24f0
⓱⓱\24f1
⓲⓲\24f2
⓳⓳\24f3
⓴⓴\24f4

括弧付き数字

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
⑴⑴\2474
⑵⑵\2475
⑶⑶\2476
⑷⑷\2477
⑸⑸\2478
⑹⑹\2479
⑺⑺\247a
⑻⑻\247b
⑼⑼\247c
⑽⑽\247d
⑾⑾\247e
⑿⑿\247f
⒀⒀\2480
⒁⒁\2481
⒂⒂\2482
⒃⒃\2483
⒄⒄\2484
⒅⒅\2485
⒆⒆\2486
⒇⒇\2487

ドット付き数字

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
⒈⒈\2488
⒉⒉\2489
⒊⒊\248a
⒋⒋\248b
⒌⒌\248c
⒍⒍\248d
⒎⒎\248e
⒏⒏\248f
⒐⒐\2490
⒑⒑\2491
⒒⒒\2492
⒓⒓\2493
⒔⒔\2494
⒕⒕\2495
⒖⒖\2496
⒗⒗\2497
⒘⒘\2498
⒙⒙\2499
⒚⒚\249a
⒛⒛\249b

ローマ数字

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
ⅠⅠ\2160
ⅡⅡ\2161
ⅢⅢ\2162
ⅣⅣ\2163
ⅤⅤ\2164
ⅥⅥ\2165
ⅦⅦ\2166
ⅧⅧ\2167
ⅨⅨ\2168
ⅩⅩ\2169
ⅪⅪ\216a
ⅫⅫ\216b
ⅰⅰ\2170
ⅱⅱ\2171
ⅲⅲ\2172
ⅳⅳ\2173
ⅴⅴ\2174
ⅵⅵ\2175
ⅶⅶ\2176
ⅷⅷ\2177
ⅸⅸ\2178
ⅹⅹ\2179
ⅺⅺ\217a
ⅻⅻ\217b

よく使うマーク

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
★★\2605
☆☆\2606
♡♡\2661
♤♤\2664
♢♢\2662
♧♧\2667
♥♥\2665
♠♠\2660
♦♦\2666
♣♣\2663
♪♪\266a
♫♫\266b
♬♬\266c

矢印・約物など

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
←←\2190
↑↑\2191
→→\2192
↓↓\2193
(((\28
)))\29
[[[\5b
]]]\5d
{{{\7b
}}}\7d
……\2026
––\2013
——\2014

数学記号

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
+++\2b
−−\2212
×××\d7
÷÷÷\f7
***\2a
===\3d
<&#60;&#x3c;\3c
>&#62;&#x3e;\3e
&#8804;&#x2264;\2264
&#8805;&#x2265;\2265
&#8806;&#x2266;\2266
&#8807;&#x2267;\2267
&#8734;&#x221e;\221e
&#8743;&#x2227;\2227
&#8744;&#x2228;\2228

一般的な記号

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
$&#36;&#x24;\24
¥&#165;&#xa5;\a5
&#8364;&#x20ac;\20a
¢&#162;&#xa2;\a2
£&#163;&#xa3;\a3
©&#169;&#xa9;\a9
®&#174;&#xae;\ae
&#8471;&#x2117;\2117
&#8482;&#x2122;\2122
&#8480;&#x2120;\2120

罫線

ニャン易度
preview数値参照10進数数値参照16進数css 擬似要素
&#9472;&#x2500;\2500
&#9476;&#x2504;\2504
&#9480;&#x2508;\2508
&#9474;&#x2502;\2502
&#9478;&#x2506;\2506
&#9482;&#x250A;\250A
&#9484;&#x250C;\250C
&#9488;&#x2510;\2510
&#9492;&#x2514;\2514
&#9496;&#x2518;\2518
&#9500;&#x251C;\251C
&#9508;&#x2524;\2524
&#9516;&#x252C;\252C
&#9524;&#x2534;\2534
&#9532;&#x253C;\253C

copypet.jp

CSS3などで新たに追加された要素・装飾方法など、日々コードを書いていないと忘れてしまったり、ささっとプロトタイプを作る時などちょっとしたことに時間をかけている暇はない。そんな時に「あ〜、あれストックしときゃよかったなぁ」って困った自分用のストックブログです。カスタマイズなどがしやすいよう、昨今のweb制作に取り入れられる一般的なコードを中心に掲載しています。

More Info

こんな記事はいかがですか?