# msgid "" msgstr "" msgid "" "I've wanted to change this website's favicon from a plain `.ico` file to a " "proper SVG. The problem I was trying to solve was to reuse the same image on" " other places, such as avatars." msgstr "" msgid "" "Generating a PNG from the existing 16x16 icon was possible but bad: the " "final image was blurry. Converting the `.ico` to an SVG was possible, but " "sub-optimal: tools try to guess some vector paths, and the final SVG didn't " "match the original." msgstr "" msgid "" "Instead I used a tool to draw the \"vector pixels\" as black squares, and " "after getting the final result I manually cleaned-up the generated XML:" msgstr "" msgid "" "\n" "\n" msgstr "" msgid "" "With the new favicon file, I now had to add to the templates' `
` a " "`` to this icon:" msgstr "" msgid "" "\n" " \n" " \n" " ...\n" msgstr "" msgid "" "Still missing is a bitmap image for places that can't handle vector images. " "I used Jekyll generator to create an PNG from the existing SVG:" msgstr "" msgid "" "module Jekyll\n" " class FaviconGenerator < Generator\n" " safe true\n" " priority :high\n" "\n" " SIZE = 420\n" "\n" " def generate(site)\n" " svg = 'static/favicon.svg'\n" " png = 'static/favicon.png'\n" " unless File.exist? png then\n" " puts \"Missing '#{png}', generating...\"\n" " puts `inkscape -o #{png} -w #{SIZE} -h #{SIZE} #{svg}`\n" " end\n" " end\n" " end\n" "end\n" msgstr "" msgid "" "I had to increase the priority of the generator so that it would run before " "other places that would use a `{% link /static/favicon.png %}`, otherwise " "the file would be considered missing." msgstr "" msgid "title: SVG favicon" msgstr "" msgid "date: 2020-12-29" msgstr "" msgid "updated_at: 2021-01-12" msgstr "" msgid "layout: post" msgstr "" msgid "lang: en" msgstr "" msgid "ref: svg-favicon" msgstr "" msgid "" "The good thing about this new favicon (at " "[`/static/favicon.svg`](/static/favicon.svg)) is that a) it is simple enough" " that I feel comfortable editing it manually and b) it is an SVG, which " "means I can generate any desired size." msgstr "" #~ msgid "" #~ "title: SVG favicon\n" #~ "date: 2020-12-29\n" #~ "layout: post\n" #~ "lang: en\n" #~ "ref: svg-favicon" #~ msgstr "" #~ msgid "" #~ "The good thing about this new favicon is that a) it is simple enough that I " #~ "feel comfortable editing it manually and b) it is an SVG, which means I can " #~ "generate any desired size." #~ msgstr ""