HTML＆CSS CSSのborderで切手風フレームを作成
border-image-sourceの値に、円を描画した画像を設定します。ここで円の色（sgvのfillの値）は、親要素と同色にしておきます。
それをborder-image-sliceで分割し、四辺に割り当て、borderの幅の半分外側に配置します。
SVG
HTML＆CSS 
HTML＆CSS CSSのborder-image-sourceの値にSVGコードを指定し、星やハートのボーダーを作成する方法
重要なのがborder-image-sliceです。
指定された画像を縦横3分割にし、上下左右のボーダーに割り当てます。
ボーダーに使用するシェイプを縦横3×3配置するSVGコードを作成し、border-image-sourceの値にしました。
HTML＆CSS 千鳥格子模様をSVGとCSSで背景模様にする
千鳥格子模様をSVGで作成し、CSSのbackground-imagプロパティで背景模様にします。CSSで背景模様にするには、background-imagの値のURLにSVGタグを埋め込むのですが、変更を加える箇所があります。
HTML＆CSS イラストレーターなし ハートのSVGタグを作成する方法
開始点、ベジェ曲線の方向点、下部の先端の座標と、上部の円弧の半径が分かれば描画できます。可愛らしいハートにするため座標を変更してみました。ジェネレーターで簡単にSVGタグが作成できます。塗色fillと同色のstrokeを太めにすると、ハートの上部の二つの円の溝を埋めることができます。
HTML＆CSS JavaScriptで座標を計算 SVGで星を作成
SVGで多角形を描画するpolygonタグのpoints属性の値（座標）を JavaScript で計算しています。それは2つの五角形の頂点で、五角形の外接円を元に計算できます。そのため、円の半径を変更すると星の大きさや角度も調整可能になります。