# (WebKit clips color layers based on the width/height of the fallback layer) # Offset the fallback layer the same amount of the outline layer OutlineLayer.attributes = outlineColorIndex # Turn the layers into Color Palette layersīaseLayer.attributes = baseColorIndex OutlineLayer = copyLayer(layer, "Color %s" % outlineColorIndex) GlyphsFilterOffsetCurve = NSClassFromString("GlyphsFilterOffsetCurve")īaseLayer = copyLayer(layer, "Color %s" % baseColorIndex) OutlineColorIndex = 1 # The color index of the outline layer OutlineThickness = 45 # The thickness of the outlineīaseColorIndex = 0 # The color index of the base layer To use the script: Copy and paste it into the Glyphs Macro Window, edit the variables, select the glyphs you’d like to outline, and hit “Run.” The script uses the same “Offset Curve” filter you can access in the Glyphs Filters menu, so you can first test your parameters manually with that before using the script. Below is the simple script we wrote to automate this process. To create the color layers of our outline font, you could manually produce each layer… or you could simply use a script and save hours of unnecessary labour. That being said… it’s 2020 and we still can’t outline type on the web! What’s going on?! The practice of developing outline fonts became far less common during the digital era as users could simply outline text in graphics software, making the requirement for a separate outline style redundant. During the 70s especially, there were tonnes of outline fonts gracing the many phototypesetting catalogues being produced. In the past, it was not uncommon for type foundries to produce outlined versions of their fonts for use in display settings. But neither of these are perfect nor elegant solutions. Then there is the “text shadow hack,” which involves misusing the CSS text-shadow property to form a solid outline around text. There is the experimental -webkit-text-stroke CSS property, but this only works in WebKit browsers. The way we define how text looks on the web is via so called “CSS properties.” Because the World Wide Web Consortium (W3C) have never introduced a dedicated text-stroke CSS property, developers have been forced to find various dodgy work-arounds. And with some text, you really want it outlined! A long-standing problem on the web is that there is no standardized way to outline text.