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

CSS HTML
 
 

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

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

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

丸囲み数字

ニャン易度
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

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