X-Pkg logo generation code

gen-icns.sh

#!/usr/bin/env bash

mkdir $2.iconset
sips -z 16 16     $1 --out $2.iconset/icon_16x16.png
sips -z 32 32     $1 --out $2.iconset/icon_16x16@2x.png
sips -z 32 32     $1 --out $2.iconset/icon_32x32.png
sips -z 64 64     $1 --out $2.iconset/icon_32x32@2x.png
sips -z 128 128   $1 --out $2.iconset/icon_128x128.png
sips -z 256 256   $1 --out $2.iconset/icon_128x128@2x.png
sips -z 256 256   $1 --out $2.iconset/icon_256x256.png
sips -z 512 512   $1 --out $2.iconset/icon_256x256@2x.png
sips -z 512 512   $1 --out $2.iconset/icon_512x512.png
cp $1 $2.iconset/icon_512x512@2x.png
iconutil -c icns $2.iconset
rm -R $2.iconset

main-logo-template.svg

<svg version="1.1"
     width="1024" height="1024"
     xmlns="http://www.w3.org/2000/svg">

     <style>
       #outline {
        stroke-width: 40px;
        stroke: #1f222a;
        fill: transparent;
        paint-order: fill;
        clip-path: url(#outline-clip);
       }
     </style>

     <path id="outline" d="M 512,0 L 955.405006738,256 L 955.405006738,768 L 512,1024 L 68.594993,768 L 68.594993,256 z"/>

     <clipPath id="outline-clip">
       <path d="M 512,0 L 955.405006738,256 L 955.405006738,768 L 512,1024 L 68.594993,768 L 68.594993,256 z"/>
     </clipPath>

     <!-- REPLACE -->
</svg>

xpkg-path.js

const stabilizerWidth = 125
const fuesalageWidth = 45

// Insert points [percentage of line, distance from line]
const points = [
  [.2, 0],
  [.21, fuesalageWidth - 42],
  [.22, fuesalageWidth - 40],
  [.23, fuesalageWidth - 37],
  [.25, fuesalageWidth - 35],
  [.22, stabilizerWidth],
  [.25, stabilizerWidth],
  [.30, fuesalageWidth],
  [.45, fuesalageWidth],
  [.45, 90],
  [.33, 280],
  [.37, 280],
  [.57, fuesalageWidth],
  [.71, fuesalageWidth - 5],
  [.73, fuesalageWidth - 8],
  [.8, 0]
]

const startX = 68.594993
const startY = -768

const endX = 955.405006738
const endY = -256

const {
  readFileSync,
  writeFileSync
} = require('fs')

const {
  PI,
  sin,
  cos,
  tan
} = Math

function lerp(v0, v1, t) {
  return v0 * (1 - t) + v1 * t
}

function point(f) {
  return [lerp(startX, endX, f), lerp(startY, endY, f)]
}

const deg = tan((endY - startY) / (endX - startX))
const udeg = deg + (PI / 2)
const ldeg = deg - (PI / 2)

function path(f, r) {
  let [px, py] = point(f)

  const ux = px + r * cos(udeg)
  const uy = -(py + r * sin(udeg))

  const lx = px + r * cos(ldeg)
  const ly = -(py + r * sin(ldeg))

  if (!r)
    return [
      [ux, uy]
    ]
  return [
    [ux, uy],
    [lx, ly]
  ]
}

const originalStr = '<path d="'
let str = originalStr

const uppers = []
const lowers = []

for (const point of points) {
  const absPts = path(...point)
  uppers.push(absPts[0])
  if (absPts[1])
    lowers.push(absPts[1])
}

console.log(uppers, lowers)
for (const point of uppers.concat(lowers.reverse())) {
  const letter = str === originalStr ? 'M' : 'L'
  str += `${letter} ${point[0]},${point[1]} `
}
str += 'z" stroke-width="0" fill="#1f222a"/>'

let content = readFileSync('main-logo-template.svg', 'utf8')
content = content.replace('<!-- OVERWRITE -->', str)
writeFileSync('main-logo.svg', content, 'utf8')

console.log(str)