Logo-free social interaction line icons, 36 free icons

This pack brings together 36 line icons for the gestures of a social interface, delivered as SVG, PNG and SVG sprite, free with an account and under a commercial licence. It is for designers and developers who build a post feed, a comment section, a messaging screen, a profile page, a forum or the community area of a product: react, comment, share, save, follow, post, report. Each file has a plain English name (like, repost, followers) that you can reuse as is in your code. All icons share the same stroke, with no fill and rounded ends, so an action bar, a post menu and a notification panel stay in one style.

The pack contains no platform logo and no drawing specific to a social network: no bird, no stylised letter, no paper plane, no scalloped badge. It draws the gestures that every interface shares. To show a platform’s logo, use the official brand kit it publishes, along with its usage rules.

• 36 line icons, in 6 families of 6:
  • Reactions (6): like, dislike, emoji, add-reaction, flame, trending;
  • Conversation (6): comment, comments, message, mention, hashtag, voice-message;
  • Sharing (6): share-nodes, repost, bookmark, pin, link, embed;
  • Community (6): following, unfollow, followers, group, profile, verified;
  • Publishing (6): compose, image, story, live, poll, event;
  • Moderation and alerts (6): notification, mute, report, block, hide, more.
• 36 SVG files, one per icon.
• 108 PNG files: each icon at 24, 48 and 96 px.
• 1 SVG sprite that gathers the 36 icons as symbols.
• 1 HTML demo page.

A few drawing choices to know before you download. verified is a generic badge, a ribboned rosette with a check mark and no scalloped edge. repost is a loop of arrows, share-nodes nodes linked by lines, story a segmented ring with a plus sign. message is an envelope, for private messaging, and comment a speech bubble. flame marks popular content, trending a rising trend. more opens the menu of a post, drawn as an ellipsis.

The pack follows the same grid as the other Beryl Design line icon packs: 24 px, 1.5 stroke, same radii and same rounded ends. If you already use one of these packs, the icons combine in the same interface without any touch-up, and no file name is duplicated.

File structure:

svg/
png/24/
png/48/
png/96/
sprite/social-interaction-line-icons.svg
demo/index.html

Production and AI

The icons were drawn as SVG with an AI assistant, then reviewed and checked one by one: rendered at 24 and 48 px on light and dark backgrounds, grid and stroke checks, then a review of each icon on a contact sheet. The pack contains no AI-generated image.

• SVG: fill-free vectors whose stroke takes the text colour (currentColor). You change the colour with the CSS color property and the weight with the stroke-width attribute, set once on the root tag. The files open in most design tools and can be used directly in code (HTML, components).
• PNG 24, 48 and 96 px: black icons on a transparent background, for a presentation, a document or software that does not import SVG.
• SVG sprite: a single file where each icon is a <symbol> named after its file, called with <use href="#like"/>.
• HTML: a standalone demo page, with no script or external resource, that shows the icons by family at 24, 48 or 96 px and in several colours, including on a dark background.

The icons come under a commercial licence: you can use them in personal and professional projects, including for clients and in products you sell, but you may not resell or redistribute the files, even for free.

• How to keep one style across a whole series: the method for producing consistent icons (in French).
• Generating your icons or using a pack: generative AI versus icon packs.

Are the icons really free?

Yes. You only need to create a free Beryl Design account to download the archive. No payment is required.

Does the pack include social network logos?

No. The pack only contains generic gestures (react, comment, share, follow, report) and no logo or drawing specific to a platform. For a logo, use the platform’s official brand kit, which sets its usage rules.

How do I change the colour and stroke weight of the icons?

In the SVG, the stroke follows the text colour: the CSS color property is enough. The weight is set with the stroke-width attribute, present once on the root tag of each file. The PNG files are delivered in black on a transparent background.

1.0.0 (11 November 2026): first version.