Convert Figma logo to code with AI

Tw1ddle logogeometrize

:white_square_button: Geometrize is a desktop app that geometrizes images into geometric primitives

1,906
127
1,906
6

Top Related Projects

12,644

Reproducing images with geometric primitives.

Convert images to computer generated art using delaunay triangulation.

Bitmap & tilemap generation from a single example with the help of ideas from quantum mechanics

A genetic algorithm toy project for drawing

2,482

Convert any image to pure CSS. Recreates images using only box-shadows.

Quick Overview

Geometrize is an open-source project that recreates images using geometric primitives. It transforms raster images into geometric primitives such as circles, rectangles, and triangles, creating a unique artistic representation of the original image. The project is implemented in C++ and includes bindings for various programming languages.

Pros

  • Creates visually appealing geometric representations of images
  • Supports multiple primitive shapes for diverse artistic outputs
  • Cross-platform compatibility (Windows, macOS, Linux)
  • Offers bindings for multiple programming languages (C++, Haxe, JavaScript)

Cons

  • May require significant processing time for complex images
  • Limited control over the final output aesthetics
  • Steep learning curve for advanced customization
  • Documentation could be more comprehensive for beginners

Code Examples

  1. Basic image geometrization:
#include "geometrize/bitmap/bitmap.h"
#include "geometrize/runner/imagerunner.h"

int main() {
    geometrize::Bitmap bitmap = geometrize::bitmap::createBitmapFromFile("input.png");
    geometrize::ImageRunner runner(bitmap);
    
    std::vector<geometrize::ShapeResult> results = runner.step(100);
    runner.writeSvg("output.svg");
}
  1. Customizing shape types:
#include "geometrize/runner/imagerunner.h"
#include "geometrize/shape/shapetypes.h"

int main() {
    geometrize::ImageRunner runner(bitmap);
    
    std::vector<geometrize::ShapeTypes> shapeTypes = {
        geometrize::CIRCLE,
        geometrize::RECTANGLE,
        geometrize::ROTATED_RECTANGLE
    };
    
    runner.setShapeTypes(shapeTypes);
    runner.step(100);
}
  1. Accessing shape data:
#include "geometrize/runner/imagerunner.h"

int main() {
    geometrize::ImageRunner runner(bitmap);
    
    std::vector<geometrize::ShapeResult> results = runner.step(1);
    for (const auto& result : results) {
        std::cout << "Shape type: " << result.shape->getType() << std::endl;
        std::cout << "Shape data: " << result.shape->getDataString() << std::endl;
    }
}

Getting Started

  1. Clone the repository:

    git clone https://github.com/Tw1ddle/geometrize.git
    
  2. Build the project using CMake:

    cd geometrize
    mkdir build && cd build
    cmake ..
    make
    
  3. Include the necessary headers in your C++ project:

    #include "geometrize/bitmap/bitmap.h"
    #include "geometrize/runner/imagerunner.h"
    
  4. Link against the Geometrize library in your project's build system.

  5. Use the geometrize::ImageRunner class to process images and generate geometric representations.

Competitor Comparisons

12,644

Reproducing images with geometric primitives.

Pros of primitive

  • Written in Go, which can offer better performance for certain tasks
  • Supports a wider variety of primitive shapes (triangles, rectangles, ellipses, circles, lines, Bézier curves, rotated rectangles)
  • Provides a command-line interface for easy integration into scripts and workflows

Cons of primitive

  • Less actively maintained (last commit over 3 years ago)
  • Lacks a graphical user interface, which may be less user-friendly for some
  • Does not offer real-time preview of the image generation process

Code Comparison

primitive:

func DrawCircle(im *image.RGBA, x, y, r int, c color.Color) {
    for dy := -r; dy <= r; dy++ {
        for dx := -r; dx <= r; dx++ {
            if dx*dx+dy*dy <= r*r {
                im.Set(x+dx, y+dy, c)
            }
        }
    }
}

geometrize:

void drawCircle(Bitmap& target, const Circle& circle, const rgba& color) {
    const int32_t cx = circle.m_x;
    const int32_t cy = circle.m_y;
    const int32_t r = circle.m_r;
    for (int32_t y = -r; y <= r; y++) {
        for (int32_t x = -r; x <= r; x++) {
            if (x * x + y * y <= r * r) {
                target.setPixel(cx + x, cy + y, color);
            }
        }
    }
}

Convert images to computer generated art using delaunay triangulation.

Pros of Triangle

  • Written in Go, offering potential performance benefits
  • Supports both image and video processing
  • Provides a command-line interface for easy use

Cons of Triangle

  • Limited to triangular primitives only
  • Less customizable compared to Geometrize
  • Fewer output format options

Code Comparison

Triangle:

triangles := processSVG(triangles, opt, width, height)
svg := fmt.Sprintf(svgHeader, width, height, width, height)
svg += svgContent

Geometrize:

std::vector<shapes::ShapeTypes> shapeTypes{shapes::RECTANGLE};
geometrize::ImageRunner runner(bitmap);
std::vector<geometrize::ShapeResult> results = runner.step(shapeTypes);

Key Differences

  • Triangle focuses solely on triangular primitives, while Geometrize supports multiple shape types
  • Geometrize is implemented in C++, potentially offering more fine-grained control
  • Triangle provides video processing capabilities, which Geometrize does not
  • Geometrize offers more extensive customization options for shape generation and optimization

Both projects aim to recreate images using geometric primitives, but they cater to different use cases and preferences. Triangle is more specialized and easier to use out-of-the-box, while Geometrize provides greater flexibility and control over the image recreation process.

Bitmap & tilemap generation from a single example with the help of ideas from quantum mechanics

Pros of WaveFunctionCollapse

  • Generates diverse and complex patterns based on simple input samples
  • Applicable to a wide range of content generation tasks (textures, levels, music)
  • Highly customizable through different constraint systems and input formats

Cons of WaveFunctionCollapse

  • Can be computationally intensive for large outputs or complex constraints
  • May produce less controllable or predictable results compared to Geometrize
  • Requires careful selection and preparation of input samples for optimal results

Code Comparison

WaveFunctionCollapse:

bool Observe()
{
    int argmin = -1;
    int amount = wave.Count;
    for (int i = 0; i < wave.Count; i++) if (OnBoundary(i))
    {
        int entropy = wave[i].Sum();
        if (entropy <= 1) continue;
        if (argmin == -1 || entropy < amount)
        {
            amount = entropy;
            argmin = i;
        }
    }
    // ... (truncated for brevity)
}

Geometrize:

public function step():Null<ShapeResult> {
    var shape:Shape = ShapeFactory.randomShapeOf(shapeTypes[0], bounds);
    var result:ShapeResult = addShape(shape, alpha, 100);
    if (result == null) {
        return null;
    }
    return result;
}

A genetic algorithm toy project for drawing

Pros of genetic-drawing

  • Focuses on artistic and creative applications, allowing for more expressive outputs
  • Simpler implementation, making it easier for beginners to understand and modify
  • Supports SVG output, which is scalable and widely compatible

Cons of genetic-drawing

  • Limited shape options compared to Geometrize
  • Less optimized for performance and large-scale image processing
  • Fewer features and customization options for advanced users

Code Comparison

genetic-drawing:

def mutate(self):
    r = random.random()
    if r < 0.1:
        self.color = (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))
    elif r < 0.2:
        self.pos = (random.randint(0, width), random.randint(0, height))

Geometrize:

void Shape::mutate(const uint32_t maxWidth, const uint32_t maxHeight)
{
    m_color = randomMutation(m_color);
    m_alpha = randomMutation(m_alpha);
    for(auto& p : m_points) {
        p = randomMutation(p, maxWidth, maxHeight);
    }
}

Both projects use genetic algorithms for image approximation, but Geometrize offers more shape types and optimization features. genetic-drawing is more focused on artistic applications and simplicity, while Geometrize provides a more comprehensive toolkit for image processing and optimization.

2,482

Convert any image to pure CSS. Recreates images using only box-shadows.

Pros of img2css

  • Generates pure CSS output, making it easy to integrate into web projects
  • Lightweight and browser-based, requiring no additional software installation
  • Provides real-time preview of the CSS-based image recreation

Cons of img2css

  • Limited to rectangular shapes, resulting in less precise image approximations
  • Lacks advanced optimization techniques for reducing the number of shapes
  • May produce larger file sizes for complex images due to CSS-only approach

Code Comparison

img2css (CSS output):

.pixel {
  box-shadow: 10px 10px #ff0000, 20px 10px #00ff00, 30px 10px #0000ff;
  height: 1px;
  width: 1px;
}

Geometrize (JSON output):

{
  "shapes": [
    {"type": "circle", "x": 100, "y": 100, "r": 50, "color": [255, 0, 0, 128]},
    {"type": "rectangle", "x": 200, "y": 200, "width": 100, "height": 50, "color": [0, 255, 0, 128]}
  ]
}

Both projects aim to recreate images using geometric shapes, but Geometrize offers more shape variety and optimization techniques, while img2css focuses on CSS-only output for web integration.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Geometrize Logo

License Geometrize AppVeyor Build Status

Geometrize is a desktop app that geometrizes images into geometric primitives.

Download Geometrize here, or run the web demo in your browser.

Geometrize Shape Animation

Features

  • Recreate images as geometric primitives.
  • Start with hundreds of images with preset settings.
  • Export geometrized images to SVG, PNG, JPG, GIF and more.
  • Export shape data as JSON for use in custom projects and creations.
  • Control the algorithm at the core of Geometrize with ChaiScript scripts.

Usage

Open the app, select an image, pick your desired shape types, and hit start.

Geometrize Getting Started Animation

Video tutorials for Geometrize are posted here:

Geometrize Video Tutorials

Shape Comparison

The matrix shows results for circles, triangles, rotated rectangles, rotated ellipses and all supported shapes at 50, 200 and 500 total shapes:

-50 Shapes200 Shapes500 Shapes
Circles50 Circles200 Circles500 Circles
Triangles50 Triangles200 Triangles500 Triangles
Rotated Rectangles50 Rotated Rectangles200 Rotated Rectangles500 Rotated Rectangles
Rotated Ellipses50 Rotated Ellipses200 Rotated Ellipses500 Rotated Ellipses
All Shapes50 All Shapes200 All Shapes500 All Shapes

Animations

By batch editing and exporting images, and then combining the results using a tool such as ScreenToGif, you can produce animations using Geometrize:

Geometrized Horse Animation Rectangles

Geometrized Horse Animation Triangles

Geometrized Horse Animation Circles

Screenshots

For more examples of geometrized images, see the gallery.

Geometrized Flower 330 Rotated Ellipses

Geometrized Train 230 Rotated Ellipses

Geometrized Trees 210 Ellipses

Geometrized Woodland Cemetery 600 Rotated Rectangles

Resources

Building

Geometrize is a Qt app written in C++.

  • Download and install Qt 5.10 or above.
  • Install Python 3.x and add it to your path. The build process includes a few Python scripts for creating resource files.
  • Checkout this repository and all submodules, and build and run geometrize.pro within Qt Creator.

If you want to develop or extend Geometrize, look at the top level repo for a high-level overview of the repositories in the Geometrize project.

Notes