feat: add raster brand exports for GitHub - #30
Merged
Merged
Conversation
GitHub accepts only PNG, GIF or JPG for organisation avatars and repository social previews, so the SVG masters need rendered companions. Approach Rendered from the same geometry as the SVGs, so nothing drifts. Verified by quantising the output: the avatar reduces to #F6F1E7, #C44F36 and #167A78, and the social card to those three plus #273447 -- the brand values exactly, which is the whole reason the mark was rebuilt as vector in the first place. The avatar is full-bleed paper rather than the clipped octagon used for the app icon. GitHub masks avatars to a rounded square; a transparent octagon inside that mask reads as a rendering mistake rather than as a deliberate shape. The mark's furthest point is 403px from centre against a 512px radius, so it survives a circular crop with room to spare. The social card carries the mark, the wordmark, the positioning line and the product's sharpest claim, separated by the same fine rule the interface uses. Two notes for whoever regenerates these. Neither the organisation avatar nor the social preview is settable through the GitHub REST API -- both are upload forms in the web UI. And these were drawn directly rather than rasterised from the SVG: cairosvg would not honour the root width and height on the 2:1 card and letterboxed it into a square, leaving white bands top and bottom. Verification helmryth-avatar-1024.png 1024x1024 #F6F1E7 #C44F36 #167A78 helmryth-social-1280x640.png 1280x640 #F6F1E7 #273447 #167A78 #C44F36 14 KB and 22 KB respectively. Impact The mark can be applied to the organisation and the repository.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this changes
Adds the raster exports of the mark. These were pushed to #29's branch a few minutes after that PR was merged, so they never landed — the branch carried them, the merge commit did not.
Why they exist
GitHub accepts only PNG, GIF or JPG for organisation avatars and repository social previews. The SVG masters merged in #29 cannot be uploaded directly.
Two decisions worth recording
The avatar is full-bleed paper, not the clipped octagon used for the app icon. GitHub masks avatars to a rounded square, and a transparent octagon inside that mask reads as a rendering mistake rather than a deliberate shape. The mark's furthest point sits 403px from centre against a 512px radius, so it survives a circular crop with room to spare.
These were drawn directly rather than rasterised from the SVG.
cairosvgwould not honour the rootwidth/heighton the 2:1 social card — it letterboxed the artwork into a square and left white bands top and bottom. Caught by sampling the corner pixel (255,255,255instead of paper) rather than trusting the render.Verification
Both quantise to the brand values exactly, which was the point of rebuilding the mark as vector in the first place:
Risk and rollback
None to the product. Four image files and a documentation table; no code, no configuration.