Repository navigation
Add OpenGraph social card generation script - #10
Merged
Merged
Conversation
Generates a 1200x630 social card that mirrors the homepage hero: synthwave sky, banded pixel-sun, perspective grid, and the block FERRUS banner with the same gradient used in src/components/FerrusLogo. themeConfig.image already pointed at this path, so Docusaurus will now emit og:image and twitter:image automatically.
Card is reduced to the hook: just the FERRUS banner over the synthwave sun + grid and the line 'Deterministic AI orchestration'. Drops the busy badges/url/sub-tagline that made it read like a screenshot. Removes the Python generator from the repo (it was a one-off tool, not part of the Docusaurus build). Home page now passes siteConfig.tagline through as the Layout description so og:description matches the site tagline rather than a longer custom string.
- Tagline sits on a translucent dark plate with an orange outline so it reads cleanly against the grid instead of bleeding into it. - Scanlines dropped to every 4px at low alpha and a slight overall blur removes the over-sharpened pixel noise. - Output is quantised to a 128-colour adaptive palette and run through oxipng, taking the file from ~237KB to ~64KB.
Reworked the layout so the tagline sits in an empty band between the sun disc and the grid horizon, instead of being plated/outlined on top of busy elements. The sun is smaller and bands fade as they descend, so it ends well above the text. Vignette and scanlines were removed in favor of a flat dark sky. File drops to ~26KB.
Matches the homepage hero closer: warm horizontal glow sits on the horizon so the grid emerges from light rather than from a hard edge; grid lines are thinner (1px), dimmer (alpha 130 instead of 160), and fewer; the grid now fades out near the bottom of the card so the densest cluster doesn't hit the edge and turn into a smear on phone thumbnails. A small blur removes razor-sharp aliasing on the lines.
The previous Gaussian-blur horizon glow read as 'layered/low quality'. Now the whole card is drawn on a 400x210 internal canvas, snapped to a 14-colour synthwave palette, then nearest-neighbour upscaled x3 to 1200x630. The horizon glow is a hand-made 4x4 Bayer dither (chunky warm pixels instead of soft blur), the sun is discrete colour rings with explicit 2px horizontal bands, and the perspective grid is 1px lines that become crisp 3px pixels in the final. Side effect: file is ~4.5KB.
The previous composition put the sun directly behind FERRUS, which killed the contrast on the middle 'RR'. The layout is now classic synthwave: - FERRUS banner at the top in clean dark sky (full letter contrast) - tagline in the gap below the banner, on dark sky - big banded sun rising from the horizon below them - perspective grid receding from the horizon down The sky uses 4x4 Bayer dithering between four palette stops so the vertical gradient never collapses into flat 'layered' bands. The horizon glow is also a Bayer-dithered halo (no Gaussian blur). The sun is clipped at the horizon line via an explicit putalpha mask so it really rises from the grid plane instead of bleeding through it. ~5KB final, 12-colour palette, internal 400x210 -> nearest x3 upscale.
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
2 participants
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.
Summary
Add a Python script to generate a synthwave-themed OpenGraph social card (
ferrus-social-card.png) that mirrors the homepage hero design from the website.Changes
New script:
scripts/generate-social-card.py— generates a 1200×630px PNG social card with:Generated asset:
static/img/ferrus-social-card.png— the output social card imageImplementation Details
lerp_color,mix) for smooth gradientspython3 scripts/generate-social-card.pyhttps://claude.ai/code/session_01PbV7zkBsfyu5rto3N6S59f