Inkscape is used to create the SVG graphics. For card sets, master-strike.com uses Font Bangers, Font Size 13.25 pt, Filter – Drop Shadow with color black, opacity 100%, gaussian blur 0, offset delta x=3.10 and delta y=2.70 (also used x=1 and y=1). Canvas size is 24×24 pixels. Text color is #fbb900 (red=251, green=185, blue=0).

For longer text such as “NOIR” the graphic artist manually stretched/scaled the image along the x-axis but keeping the y-axis fixed.

Since SVGs are vector, you don’t actually need a separate 24px version.

Document Properties
→ Units: px
→ Page: 300 × 300
→ Scale: 1
→ Save as Plain SVG

Can use Inkscape and work at 300px with a viewBox=”0 0 300 300″ and then use CSS to display them at 24px. The browser scales them perfectly with no quality loss

img.set-icon {
  width: 24px;
  height: 24px;
}