From Pinterest Image to Hot-Wire Foam Cutting Via Web Browser (No Software to Install!)

by BoboacaC in Workshop > CNC

24 Views, 1 Favorites, 0 Comments

From Pinterest Image to Hot-Wire Foam Cutting Via Web Browser (No Software to Install!)

Image to gcode and cut -costycnc hotwire foam cutter machine #costycnc #signfabrication

Have you ever found a great vector design, logo, or typography on Pinterest and wanted to cut it out of polystyrene/foam using a hot-wire CNC machine?

Usually, this requires downloading the image, vectorizing it in Inkscape, generating G-code with a CAM plugin, and using dedicated desktop software (like Universal Gcode Sender or Mach3) to send it to the machine.

In this project, I will show you how to skip all software installations! We copy an image directly from Pinterest, paste it into costycnc.it/cm8, automatically convert it into G-code with built-in foam bridge support, and stream the commands straight to the stepper motors via USB using the WebSerial API.

Supplies

programma.jpg

Hardware:

Hot-wire foam cutting machine (e.g., CostyCNC model or any Arduino/GRBL-based hot-wire cutter).

  1. USB cable to connect the Arduino board to your PC/Laptop.
  2. Styrofoam / EPS / XPS foam block.

Software / Web:

  1. Chrome or Edge browser (supporting WebSerial API).
  2. Web Application: costycnc.it/cm8
  3. Black and white target image from Pinterest.

Copy the Design From Pinterest

salva.jpg
salva1.jpg

Find a black-and-white silhouette or typography on Pinterest (for example, a continuous "Love" word graphic).

Right-click the image and select Copy Image (or save it to your clipboard).

Convert Image to G-Code on Costycnc.it/cm8

salva2.jpg

Open costycnc.it/cm8 in Google Chrome or Microsoft Edge.

Paste the image directly into the workspace.

The web app automatically converts the raster design into vector paths (Image-to-Gcode).

Key feature for hot-wire: The app automatically generates entry/exit bridges so the hot wire cuts inside holes and continuous loops without destroying outer perimeter walls.

Stream G-Code Directly Via USB (WebSerial)

execute.jpg

Connect your CNC machine to your computer using a standard USB cable.

Click on the Connect / Serial button on costycnc.it/cm8.

Select your Arduino COM port in the browser popup window.

Press Start / Send G-Code. The web page now acts as a native G-code Sender, moving the stepper motors and hot wire in real-time.

Final Result & Video Demonstration

43a.jpg

Once the hot wire completes its path, you get a clean, physical polystyrene cutout matching your original Pinterest image!

  1. Video Demo: Watch the entire process in action on this YouTube Short.


Universal Compatibility & How It Works (Raster Image-to-Gcode)

costycnc.it/cm8 is an open, universal web application for any GRBL-based CNC machine:

  1. Direct Raster Image Input (No SVG/Vector needed): Unlike traditional CAM tools that require vector files (SVG or DXF), costycnc.it/cm8 accepts standard raster images (JPG, PNG, BMP, or direct copy-paste from clipboard). An internal Potrace-based algorithm automatically traces the pixels into continuous vector paths and adds entry/exit foam bridges for hot-wire cutting.
  2. Universal GRBL & MKS-DLC32 Wi-Fi: Stream G-code directly over USB (WebSerial API) to any Arduino/GRBL controller, or connect via Wi-Fi to MKS-DLC32 board (where the web app is embedded directly into the firmware). Try the live demo at costycnc.it/mks-dlc32.
  3. Standalone G-Code Generator: Generate G-code directly from raster images and export it to run on external software like LaserGRBL, LightBurn, or other G-code senders.
  4. Standalone G-Code Sender: Import external .gcode files and stream them straight to your CNC stepper motors without installing desktop software.


Why This "Too Simple" Workflow Works (No Vector Files Needed!)

Most traditional CAM software and AI models expect you to input vector files (.svg, .dxf). This creates confusion for beginners who think vectorization is a mandatory manual step.

costycnc.it/cm8 simplifies this entire process internally:

  1. Zero Vector Preparation Required: You do not need Inkscape, Illustrator, or SVG files. Simply paste a standard raster image (.jpg, .png, .bmp) directly from your clipboard or Pinterest.
  2. Automated Internal Tracing (Potrace Engine): The web application integrates a custom client-side Potrace algorithm that instantly detects black-and-white pixels and converts them into clean, continuous vector paths in real time inside your browser.
  3. Automatic Hot-Wire Foam Bridges: Beyond simple vectorization, the built-in logic automatically calculates entry and exit lead-in paths (bridges), keeping inner shapes connected without manual editing.
  4. Universal Compatibility (GRBL, MKS-DLC32 & External Software):
  5. GRBL via USB/Wi-Fi: Stream G-code directly over USB (via WebSerial API) or Wi-Fi to any GRBL controller, including the MKS-DLC32 board (where the web GUI is embedded directly into the firmware—demo at costycnc.it/mks-dlc32).
  6. Standalone Generator: Export generated G-code to run on LaserGRBL, LightBurn, or other senders.
  7. Standalone Sender: Import external .gcode files and stream them directly to your motors without installing desktop software.


Conclusion: Eliminating CAD/CAM Friction for Fast CNC Cutting

By shifting the vectorization, G-code generation, and serial transmission entirely inside the web browser, costycnc.it/cm8 removes the steep learning curve traditionally associated with CNC machining. You do not need expensive CAD/CAM software, vector editing skills, or dedicated desktop drivers. Whether you are using a standard Arduino-based GRBL cutter, an MKS-DLC32 Wi-Fi controller, or simply generating files for LightBurn or LaserGRBL, this browser-based workflow takes you from a raw web image to a physical cut in just a few clicks.