CSSの [:after] や [:before] の方が、オリジナルのデザインマークを設置することができますが、こんな方法はいかがでしょうか。なんだかレトロな感じもして好きですね。ぜひ、ちょっとしたアクセントに活かしてみてください。
[ 桁数字; ] で記述してください。
| ▚ | 9626 |
| ▞ | 9630 |
| ▟ | 9631 |
| ■ | 9632 |
| □ | 9633 |
| ▢ | 9634 |
| ▣ | 9635 |
| ▤ | 9636 |
| ▥ | 9637 |
| ▦ | 9638 |
| ▧ | 9639 |
| ▨ | 9640 |
| ▩ | 9641 |
| ▰ | 9648 |
| ▱ | 9649 |
| ◈ | 9672 |
| ◉ | 9673 |
| ◍ | 9677 |
| ◩ | 9705 |
| ◪ | 9706 |
あまり見掛けないのがもったいないくらいです。簡単に使えるので便利ですよ。

