Pxl Prfct.
Free to use. Made for creating.

Design freely.
Make it yours.

A free workspace for interface design, prototypes, and SVG animation. Create layouts, bring vector artwork to life, and keep your editable files.

Download for free Explore the source

Early access · Windows preview available
Meet the SVG animator

A canvas for what comes nextPxl Prfct / Design
Pxl Prfct editing a sample studio dashboard with layers on the left, a design canvas in the center, and properties on the right.
Actual editor. Sample artwork. Development build.Expand image

In development · Finer SVG editing, new exports, and a movable toolbar

01 Free to use02 Local projects03 Source available04 Built to be extended

The product

From the first shape
to the finer details.

Pxl Prfct is a browser-first design editor with a desktop app and optional self-hosted workspaces. Start with a local project, explore a layout, and take your work with you.

01 / CREATE

A familiar place to design

Draw shapes and vectors, work with text and images, organize layers into frames, and turn repeated ideas into reusable components. Properties stay close to the canvas.

Explore the editor
02 / BUILD

Give your layouts structure

Use Flexbox and CSS Grid layout, styles, and variables to develop consistent interfaces. Connect screens with prototype interactions and export artwork or HTML/CSS.

See capabilities & limits
03 / KEEP

Your work, in your hands

Local drafts let you begin without a hosted account. Download editable .pixl files for backups and sharing. For team work, run a workspace on infrastructure you manage.

Read the self-hosting guide

A separate design type In the Windows preview

Meet the
SVG animator.

Give icons, illustrations, and interface details their own timeline. SVG Animation is a dedicated workspace: import vector artwork, shape its movement with keyframes, and export an SVG for the web.

Pxl Prfct SVG animator with a glider following a curved motion path, property tracks in the bottom timeline, and a custom easing curve in the right inspector.
Actual animator. Sample artwork. Editable tracks and motion paths.

From artwork to animation

  1. Start with an SVG

    Choose New design → SVG Animation from Projects. Import or drop in an SVG, try the built-in example, or start with a rectangle or ellipse.

  2. Set the timing

    Select an element and use its handles to stretch or rotate it at the playhead. Add property tracks to animate other values. Select keys across tracks, set their exact start and duration, and apply a shared easing curve. Duplicate keys at the playhead, Shift-drag to align them, reuse keys on another element, or reverse them to create a return animation. Jump to the previous or next keyframe without losing your selection. Pause to inspect the artwork, then resume from that moment.

  3. Preview and export

    Preview the generated SVG, choose when it plays, and download it. Save a .pixl copy to keep your editable timeline.

Read the animator guide

Control the timingAnimate position, rotation, scale, opacity, fill, stroke, and dash offset on independent property tracks. Shape the pace with keyframes and custom Bézier easing.

Shape the movementFollow a motion path with optional auto-rotation, or morph a shape by editing its anchors and handles at different times.

Make it respondExport on-load, hover, or click animations. Choose once or loop, and set what happens when the pointer leaves or someone clicks again.

Pxl Prfct SVG animator with the central Core object selected, blue bounds, four corner resize handles and a dimensions label, alongside the inspector and timeline.
Shape it on the canvas. Stretch with an edge, resize with a corner, or drag just outside a corner to rotate.

See the export. Try the result.

The SVG animation export dialog with a menu icon preview and click, reverse, and repeat controls.
Preview the animation you’ll export. Click to expand.

TRY AN EXPORTED SVG

Open the interactive SVG example

Click the icon. Click again to reverse.
Keyboard: focus the icon, then Enter or Space.

An actual export from Pxl Prfct.
Download this SVG

SVG Animation is included in the Windows v0.1.1-alpha.21 preview. Choose New design → SVG Animation to start. Draw open paths with Pen or Pencil, edit anchors, and animate gradients independently of object rotation. Arrange parent panels in separate windows or compact icon docks. Select, move, and copy groups of keyframes across tracks. Apply easing to the whole selection, or stretch and compress its timing with precise Start and Duration controls. Copy transform and appearance keys onto another element with Paste to selected element. Choose Reverse keyframes to turn a selected sequence and its easing into a return animation. Duplicate selected keys at the playhead with Cmd/Ctrl+D. Shift-drag snaps to the playhead or other keys while keeping the group’s spacing; Alt bypasses snapping. Each edit is one undo step. Alt/Option+Left/Right jumps between keyframes while keeping your selection; the timeline menu offers the same actions. Alpha.20 adds canvas stretch and rotation handles. Shift keeps proportions or snaps rotation to 15°; Alt/Option resizes from the center. A completed gesture adds keys at the playhead as one undo step, and Escape cancels it. Interactive SVGs work inline or in an <object>; scripts do not run in image tags. Animation export currently supports SVG; video export and editable animation-project imports are not supported. Workflow, supported features & limitations

Pxl Prfct icons Free · MIT licensed

Small details.
Ready to use.

679 interface icons for websites, apps, and the things you’re building. One consistent collection in Light, Regular, and Bold, with SVG downloads and fonts for the web and design tools.

A selection from the collection

  • arrow-right
  • search
  • home
  • settings
  • heart
  • star
  • calendar
  • location
  • layers
  • layout-grid
  • pen
  • component
  • code
  • file-svg
  • image
  • play
  • cart
  • chart-bar
18 of 679 icons24px grid · Three weights
Browse all 679 icons Download icon pack

Find an icon in the gallery to download its SVG. The complete pack includes WOFF2, TTF, CSS, and the source catalog.

The icon library has its own MIT license, separate from the editor’s Community License. Free for personal and commercial use, modification, and redistribution with the license notice. Explore the icon source

Why Pxl Prfct?

A design tool
you can build on.

The idea is simple: useful creative software should be free to use, open to understand, and possible to make your own.

Pxl Prfct brings visual design, prototyping, and motion into one evolving project. The editor runs in the browser, backed by a Rust document engine compiled to WebAssembly. The desktop app makes the same workspace available as an installable application.

It’s for people who want to explore an idea locally, learn how a design tool works, adapt it to a particular workflow, or host a workspace for their team. Developers can also connect AI tools through the project’s optional MCP server.

Explore a free design workspace with source available for layouts, reusable components, prototypes, and vector animation. Pxl Prfct is an independent project with its own implementation and roadmap.

This is early software with documented import and editing limits. Local .fig import includes a conversion report; some advanced features need rebuilding. Keep your originals and back up important work.

Read about design file import

Free to create

Your work.
Your business.
Free tools.

Build it. Ship it. Sell your work.
Keep the editor free.

Use Pxl Prfct for personal projects, your business, or paid client work. Sell the websites, apps, artwork, and animations you create. Normal SVG and HTML/CSS exports can be part of commercial products, and your own work can stay private.

The Community License lets you study, modify, and share the editor. You cannot sell Pxl Prfct, software derived from its implementation, paid features, or paid hosted access. Shared or hosted versions must provide their corresponding source for free under the same terms.

This is source-available software, not an OSI-approved open-source license. Forks are welcome within these terms; changes to the official repository still require the owner’s approval.

Fork on GitHub Read the license

Previously published MIT / Apache 2.0 versions retain their original permissions. This change is not retroactive. Licensing details & version history

Start making

Get Pxl Prfct.

Free to download. Free to use.
Choose the Windows preview or build the latest source yourself.

LATEST DEVELOPMENT

Build from source

Explore the newest editor, SVG Animation, and team-workspace changes. Build the browser app or package the desktop application with Node.js and Rust.

Build instructions Source ZIP

OTHER PLATFORMS

macOS & Linux

Public installers are not available yet. Run the browser editor from source; macOS desktop build instructions are in the repository. A public Mac release awaits signing and notarization.

Desktop build guide

Downloads are hosted on GitHub Releases. This preview adds Pen/Pencil drawing, editable open paths, independent gradient animation, detachable panels and icon flyouts. It includes SVG import, grouped keyframe editing and easing, precise selection timing, animation reuse and reversal, keyframe duplication, snapping and navigation, canvas stretch and rotation handles, motion paths, morphing, and interactive SVG export. It uses the Community License: creating and selling your own work is allowed; selling or monetizing the editor or derived software is not. Earlier v0.1.0-alpha.1 downloads retain their MIT / Apache 2.0 terms. All releases

A few useful details

Before you begin.

Is Pxl Prfct really free?

Yes. There is no subscription or paid tier. The source and public downloads are free. If you choose to self-host a team workspace, your own infrastructure costs are yours to manage.

How do I try the SVG animator?

Install the Windows preview or build the latest source, then choose New design → SVG Animation from Projects. Save .pixl files for editable timelines; an exported SVG is the playback file. Explore the animator.

Do I need an account?

No hosted account is needed to create local projects. Team workspaces use accounts on the server you connect to. Local drafts live in browser or app storage, so download .pixl backups for important work.

Can I bring in existing design files?

You can import local .fig design files. The importer creates a separate editable project and reports conversion limits. Some source features need rebuilding; keep the original file and review the result. Read the import guide.

Is this ready for production work?

Pxl Prfct is in active development. The available desktop package is an early, unsigned preview. Try it, report issues, and keep backups; review the capability matrix and release notes before relying on a particular workflow.

Can I sell websites and apps I create with it?

Yes. Commercial client work, websites, apps, artwork, and animations made with the editor are allowed. That includes code and animation players included by normal exports as part of your work. Your output does not need to be free or source-available.

Can I sell or monetize a fork?

Under the Community License, you cannot sell the editor, software derived from its implementation, paid features, or hosted access. You can modify it privately and share free versions with their corresponding source under the same license. Earlier MIT / Apache 2.0 versions retain their original permissions. Read the licensing details.

Where can I report a problem?

Use GitHub Issues for bugs and feature requests. For security vulnerabilities, follow the private reporting policy.