
Preview image. Unlock full-res
Dark split OG card with a "Make a mockup. Get a website." headline on the left and a colorful website-builder UI mockup with floating panels on the right.
Summary
A black card splitting the lowercase "graphite" wordmark and a two-line "Make a mockup. Get a website." headline on the left against a vivid website-builder canvas with floating editor panels on the right. The defining move is the dark/colorful contrast between a calm pitch and a lively product.
Visual description
The left half is near-black with thin purple wave-line graphics in the lower corner; it holds the lowercase white "graphite" wordmark and a bold two-line white headline, "Make a mockup. Get a website." The right half shows a builder interface: a mock "Altitude" landing page with a hot orange-to-pink gradient mesh hero reading "Touch fu...," a navigation bar, and a yellow "Start Journey" button, overlaid with two floating editor cards: a "Design" panel listing Grid, Fonts, Colors, Variables, and a "Colors" palette panel with named swatches (Emotion, Silence, Flame). A selection box with handles sits over the hero.
Key takeaway
Contrasting a quiet dark text panel with a saturated, in-progress editing canvas to dramatize a before/after ("mockup in, website out"). Floating editor panels with real labels make the tool feel hands-on.
Reuse notes
Strong for design-to-code, no-code, or site-builder products. Needs a colorful, convincing canvas mockup to carry the right side. Works best at full OG width because the editor panels and hero bleed off the right edge.









