What is LogoShack?

A focused parametric logo sketching tool with SVG export.

Overview

LogoShack is a small browser-based tool for exploring logo marks through shape operations, repetition, and transformation. It is made for the early design phase, when an idea is still flexible and you want to try many structural variations quickly.

Instead of building a perspective grid, setting up a complex scene, or manually duplicating every element, you can start with one base shape and adjust the system around it. The goal is not to replace a full design editor. LogoShack is intentionally narrow: it keeps the controls for this one task close together, so you can sketch, compare, and copy an editable SVG in a few clicks.

Who it is for

LogoShack is useful for designers, brand builders, students, and visual experimenters who want to generate clean geometric marks, radial systems, badges, icons, symbols, monograms, abstract signs, and repeated-form logo concepts.

How the workspace works

The canvas in the center shows the current mark. The left panel defines the source shape and the main repetition system. The right panel helps you preview, export, edit layers, mirror the result, add nested rings, and inspect the generated SVG code. Most controls are live, so changing a value immediately changes the mark.

Shape

Shape is where the base element begins. You can generate a polygon, star, ellipse, or organic blob, then adjust its size, sides, roundness, width, height, and rotation. You can also import your own inline SVG and use that as the starting element.

Repeat

Repeat controls how many copies of the base element are used. This is the fastest way to move from one shape to a radial symbol, wreath, burst, pattern, or compact mark made from multiple related parts.

Transform

Transform places the selected element or the whole scene. Radius moves copies away from or toward the center, Rotate changes their angle, and Scale changes their size. These controls are useful for finding the basic structure of the mark before adding more variation.

Progression

Progression adds change across the repeated copies. You can increase radius, scale, spin, and fade from one copy to the next, then shape that change with curve and power controls. This is useful for spirals, motion, depth, unfolding shapes, and marks that feel less mechanically uniform.

Perspective

Perspective changes each copy's geometry from its own center. It can create a simple sense of direction, foreshortening, or dimensional pressure without setting up a full 3D scene.

Distribution

Distribution affects the layout path rather than the shape itself. Tilt and depth can compress the repeated arrangement so the whole system feels like it is receding, leaning, or sitting on a plane.

Preview and Export

Preview shows the mark at different scales, which helps check whether it still works when reduced. Export lets you copy the SVG, save it as a file, or copy a link to the current settings so the same composition can be reopened later.

Layers

Layers let you combine multiple shape systems in one mark. You can add another layer, merge layers together, or cut one layer from another to create more complex silhouettes and negative-space effects.

Path edit

Path edit gives direct control over points in the generated or imported shape. It is useful when the overall system is working, but the base element needs a small manual adjustment.

Mirror

Mirror flips the result across the horizontal or vertical axis. It is a quick way to test symmetry, build paired forms, or turn a composition into something more balanced.

Nested ring

Nested ring adds a smaller repeated system inside each main copy. It can create detailed radial marks, decorative structures, flower-like forms, technical symbols, and dense patterns while still keeping the main shape editable.

Code

Code shows the inline SVG generated by the current design. This makes the result easy to move into a design file, website, prototype, or another tool that accepts SVG.

Why I made it

I often think about logos as operations on form: a base shape, a transformation, a set of parameters, and a few decisions about rhythm and balance. Pencil and paper are still great for that, but I wanted a small digital tool where these parametric experiments could happen quickly, with the base element always under control and the SVG ready to copy when the sketch starts to feel promising.