Staaarter Tools

Star-shaped PNG Creator

Uploads a PNG, center-crops it to a square, then masks it with a configurable star polygon (3 to 12 points) using a ray-casting point-in-polygon test, so pixels outside the star become fully transparent. A free online tool from Staaarter, right in your browser.

Runs locallyUpdated 2026-07-26
editortransformgeneratorimagepng

Overview

Introduction

This tool masks a PNG into a star shape directly in your browser, cropping to a square and then applying a configurable multi-point star polygon mask.

It's a fun way to produce star-shaped badges, stickers, or decorative graphics from any square or rectangular source image.

What Is Star-shaped PNG Creator?

A client-side shape-masking tool that center-crops an uploaded image to a square, computes the vertices of a star polygon with your chosen number of points, and tests every pixel against that polygon.

Pixels outside the star polygon are made fully transparent; pixels inside it retain their original color and alpha.

How Star-shaped PNG Creator Works

The image is first center-cropped to a square exactly like the round PNG creator. Star vertices then alternate between an outer radius and a half-sized inner radius, spaced evenly around the center by angle.

Each pixel in the cropped square is tested against the resulting polygon using a standard ray-casting algorithm, which counts how many polygon edges a ray from the pixel crosses to determine if it's inside.

When To Use Star-shaped PNG Creator

Use it to create a star-shaped sticker, badge, or icon from a logo or photo.

It's also handy for decorative social media graphics or thumbnails that need an eye-catching non-rectangular shape.

Often used alongside Round PNG Creator and Wavy-shaped PNG Creator.

Features

Advantages

  • Supports any number of star points from 3 to 12 for different visual styles.
  • Runs entirely client-side with no server upload.
  • Uses a mathematically precise point-in-polygon test rather than an approximation.

Limitations

  • The star is always centered on the cropped square with no rotation or offset controls.
  • The inner-to-outer radius ratio is fixed, so the star's 'pointiness' can't be separately adjusted.

Examples

Create a classic 5-point star badge

Input

A 300x300 PNG, points=5

Output

A 300x300 PNG masked into a 5-point star with transparent corners

The default 5-point star gives the familiar five-pointed shape, centered on the cropped square.

Create a spiky 10-point star

Input

A 400x600 PNG, points=10

Output

A 400x400 PNG (cropped from the rectangle) masked into a 10-point starburst shape

More points produce a denser, spikier starburst-style outline.

Best Practices & Notes

Best Practices

  • Use a square or near-square source image so the crop doesn't remove too much of your subject before masking.
  • Try a few point counts (5, 6, 8) to see which best fits your design intent.

Developer Notes

The pure function duplicates the center-crop math from the round PNG creator inline (kept independent rather than imported, since the two tools' masks are unrelated), computes star vertices via trigonometry, and applies a standard even-odd ray-casting point-in-polygon test per pixel to decide the alpha mask.

Star-shaped PNG Creator Use Cases

  • Making a star-shaped sticker or badge graphic
  • Creating decorative star-shaped social media thumbnails
  • Producing award or rating-themed star cutout images

Common Mistakes

  • Uploading a very wide or tall rectangular image and being surprised how much gets cropped away before the star mask is even applied.
  • Expecting the star's points to be independently adjustable in sharpness — only the point count is configurable.

Tips

  • Pad your image to a square first with the square PNG creator if you don't want any cropping before the star mask is applied.
  • Higher point counts create a more intricate starburst look, while 5 or 6 points read as a classic star.

References

Frequently Asked Questions