JUSTIN BARNES / ENGINEERING
← Back to projects

Personal

Name Tag Generator

I built a browser tool for designing printed name tags. People can choose the shape, lettering, size, and strap-hole position before I make the physical part.

Examples of the rectangle, hexagon, and circular name-tag designs.
Examples of the rectangle, hexagon, and circular name-tag designs.

From browser choices to a part

I built a JavaScript interface with an SVG preview for selecting the shape, names, font, lettering depth, and strap-hole position. The selected parameters are submitted as JSON for the local CAD workflow.

Working within the geometry

The browser checks layout constraints such as text fit and hole clearance. Final solid geometry is generated and checked separately in the local manufacturing workflow.

Printed examples

The photos show rectangular and hexagonal tags with raised lettering and contrasting colors.

Technical details

  • Interface: Astro page with JavaScript, SVG preview, and JSON design parameters.
  • Options: Rectangle, hexagon, or circle; five bundled fonts; raised or recessed lettering.
  • Part dimensions: 3.2 mm base thickness; selectable lettering depth from 0.2 to 1.2 mm.

A closer look

Printed rectangular tags with raised lettering in contrasting colors.
Printed rectangular tags with raised lettering in contrasting colors.
A printed hexagonal tag with raised lettering and a strap hole.
A printed hexagonal tag with raised lettering and a strap hole.