How to Generate a Low Poly Triangle Pattern with Trianglify.io

Updated

Trianglify.io is a browser-based generator for low poly triangle patterns, intended for wallpapers and website assets. To use it, open the site with JavaScript enabled, adjust the available controls until the preview looks right, then download or export the result. The page itself only renders as "You need to enable JavaScript to run this app," so a working JavaScript-enabled browser is the one hard requirement before anything else appears.

Before you start

  • Use a modern desktop or mobile browser with JavaScript turned on. If scripts are blocked, you will see only the JavaScript notice instead of the generator.
  • No account or install is described on the site; the tool runs in the page.
  • Decide the output purpose first, because it drives your settings: a phone wallpaper needs a tall aspect ratio, while a website hero or background asset usually needs a wide one.

Generating a pattern

  1. Open trianglify.io in your browser and wait for the app to load. Expected result: the generator interface and a live triangle-pattern preview replace the JavaScript notice.
  2. Set the canvas or output dimensions to match your target. For a phone wallpaper, choose a portrait ratio; for a site asset, choose a landscape ratio. Expected result: the preview reshapes to the new proportions.
  3. Adjust the pattern controls. Typical low poly generators expose variables such as cell or triangle size, color palette, and variance or randomness. Changing these updates the preview immediately. Expected result: triangle density, color scheme, and irregularity change in the preview.
  4. Regenerate or randomize until you get a composition you like. Because the pattern is procedurally generated, the same settings can produce a different arrangement on each run.
  5. Download or export the pattern using the site's download control, then use the file as a wallpaper or drop it into your site as an image asset.

What to check in the preview

What you want What to adjust What you should see
Denser, finer triangles Smaller cell/triangle size More, smaller triangles filling the canvas
Bolder, more graphic look Larger cell/triangle size Fewer, larger triangles
Specific mood or brand colors Color palette selection Preview recolors to the chosen scheme
More organic, less uniform mesh Higher variance/randomness More irregular triangle shapes and placement
Correct fit for device or layout Canvas dimensions/aspect ratio Preview matches your target proportions

Common snags

  • Blank page or only the JavaScript message. JavaScript is disabled or blocked by an extension. Enable it for the site and reload.
  • Downloaded image doesn't fit the screen. The aspect ratio was set for a different device or layout. Regenerate at the correct dimensions rather than stretching the file.
  • Pattern looks too uniform. Increase the variance or randomness control; low variance produces a flatter, more regular mesh.
  • Colors clash with your design. Change the palette before downloading rather than editing colors afterward.

Practical notes

  • Generate at the largest size you need, then scale down; upscaling a downloaded pattern will soften the triangle edges.
  • For website use, export the pattern as an image and reference it in CSS or HTML like any other asset.
  • Because results are randomized, save a version you like before regenerating, or you may not be able to reproduce the exact arrangement.