All maker tools

Social card preview

Preview how your product page could look when someone shares a link. Enter a title, description and page URL, then choose an optional local image to inspect the composition. This free tool runs in your browser without an account, API key or external requests for your inputs. It also generates escaped Open Graph and social card tags you can copy into your website.

Draft your social sharing card

Start with the editable RadarMakers example, then enter your own page details. Everything runs in this browser. No account or upload is needed.

The RadarMakers example is loaded below. Edit any field to make it yours.

Approximate card preview

Choose a local image to review its composition.

radarmakers.com

RadarMakers | Discover indie projects and SaaS

Explore indie projects and SaaS, or submit your own product to the free RadarMakers directory.

This is a generic mockup. Sharing services choose their own crops, line limits and layouts. A local image is not uploaded or linked to the public image URL.

Open Graph and social metadata

Copy these tags into your page head using your site framework. Blank fields are omitted. Image tags require a valid public image URL. Check the output before publishing.

How to use the social card preview

  1. Replace the example title with your page title. Explain the product or page in plain language, then add a description that gives readers a concrete reason to open it. The character counts help compare drafts; they are not platform limits.
  2. Enter the full page URL, including HTTPS. The preview shows its host as a text label. It does not open the address, read your website or inspect existing tags. Invalid addresses are excluded from the generated URL tag.
  3. Choose an optional raster image from your device. Compare the wide and narrow cards, then switch between filling the frame and showing the whole image. Move the alignment to see which details survive a crop. The selected file stays local.
  4. Add the public image URL you intend to publish and a useful image description. This separate address adds image metadata without loading it. Copy the tags into your page head through your website framework, then review the published page yourself.

Practical tips for a readable sharing card

Lead with the page promise. A product name alone may not tell a new reader what the link offers. Put the useful action or topic early in the title, since a narrow card may hide the ending. Let the description add context rather than repeat the same words. Use facts you can support on the destination page and remove promises the product cannot yet deliver.

Choose an image with one clear focal point. Small interface labels can become unreadable when reduced, so consider a focused product view instead of a full dashboard. Keep essential text and logos away from the edges. The crop controls are for this mockup only; they do not edit your file or add crop instructions to your tags. Export the composition you actually want before publishing.

Describe meaningful image content in the image description field, rather than listing keywords. Publish the image where it can be accessed without an account. The metadata output escapes special characters for HTML attributes, but your framework may provide its own metadata API. Use that API consistently and avoid adding duplicate title, description or image tags alongside existing values.

After publishing, check that the page head contains the intended tags and that the image address opens publicly. A refreshed page does not necessarily refresh a sharing service cache. Keep a record of the title and image you published so you can distinguish a cached card from a new draft. Use the product launch checklist to review the rest of your launch preparation.

Frequently asked questions

Does this tool check my live Open Graph tags?

No. It creates a draft from your inputs without fetching any URL. It cannot verify published metadata, public image access, redirects or cached cards. Review the live page separately after publishing.

Is my local image uploaded?

No. The preview uses a temporary browser object URL for the selected file. That URL is released when you replace or remove the image or leave the tool. It is never included in the generated metadata.

Why is the public image URL a separate field?

Other people cannot access an image stored only on your device. Publish that image at a stable public address and enter the address to generate image tags. Leaving this field blank omits image tags, even when a local preview image is selected.

Will every sharing service show this exact card?

No. This preview uses a generic layout with an image frame in a 1200 by 630 ratio. Services may crop images, shorten text, omit descriptions or reuse a cached version. Use the mockup to compare drafts rather than predict an exact result.

Ready to share your product?

RadarMakers is a free directory for indie projects and SaaS. Prepare a clear tagline, explain who your product helps and include real screenshots when you submit.

Submit your product