镜像站点 · 本页由第三方 GitHub 只读镜像提供,非 GitHub 官方站点,不接受任何登录或凭据输入。前往 github.com
Skip to content

About

Pixel Art Icons made simple for Flutter, powered by pixelarticons and fontify.

Topics

Resources

Stars

27 stars

Watchers

2 watching

Forks

Repository files navigation

Pixel Art Icons package for Flutter

This package provides a set of pixel art icons as font for Flutter, it can be used in the same way we use Icons class.

Icon set created by @halfmage, if you like this free icon set you will also like the premium ones.

Flutter library created by alexcastro.dev. A libsrc.dev project.

Show preview

Pixelarticons - Frame Pixelarticons - Frame

Install the package

You can check the latest version on pub.dev/pixelarticons.

dependencies:
  # ...
  pixelarticons: <latest-version>
  # ...

or run:

flutter pub add pixelarticons

Import the package

Import wherever you want:

import 'package:pixelarticons/pixelarticons.dart';

Use as IconData

pixelarticons package uses the IconData class, so the usage is pretty much the same of the Icons class but renamed to Pixel.

Be aware:

  • Lower-case for all icons and no separators, for example arrow-down is written as Pixel.arrowdown.
  • Names starting with numbers and Dart keywords get a k prefix.

Icon full list https://pixelarticons.com/free/.

Icon(Pixel.android);
Icon(Pixel.clock);
Icon(Pixel.arrowdown);

Develop locally

Use Dart 3.8+ and Flutter 3.32+ for the package. Development of the example and locked release tool uses Flutter 3.47+ / Dart 3.13+. Android also requires JDK 17.

The font and generated Pixel class are committed, so a fresh checkout works without downloading upstream icons or running the generator:

flutter pub get
flutter analyze
flutter test
cd example
flutter run -d chrome

The example also supports Android (flutter run with an Android device).

Development shortcuts use globally installed rps. Install it once with dart pub global activate rps, and ensure Dart's pub cache bin directory is on your PATH:

rps format
rps analyze
rps test
rps example -d chrome
rps build web
rps tool analyze
rps tool test
rps sync --dry-run

Sync and generate icons

Automation lives in tool/, a standalone Dart package. Run its commands from that directory so Dart resolves the tool's own dependencies:

cd tool
npm ci
dart pub get
dart run bin/pixelarticons_tool.dart --project-root .. --dry-run
dart run bin/pixelarticons_tool.dart --project-root ..

A sync fetches the current upstream commit, downloads that exact revision, extracts the free SVGs, and generates both fonts/pixelarticons.ttf and lib/pixel.dart. The original SVGs are also bundled in example/assets/icon_vectors.json for the demo’s previews and copy actions. Font conversion uses the npm package svgtofont. Node.js 22 or newer and npm ci in tool/ are required for generation. All icons retain their 24×24 grid and lowercase Dart names, including keyword and numeric prefixes. Codepoints are assigned explicitly in sorted Dart-name order, starting at E000. Paper.js parses SVG paths and Clipper unions their filled contours before svgtofont conversion, preserving touching edges, overlapping shapes, and intentional holes. Each element’s fill rule is resolved before combining it with other elements. Only temporary generation copies are flattened. The current upstream sources contain untransformed straight paths; unsupported elements or curves cause generation to fail explicitly.

This breaking release uses only the current upstream icon set. Removed v1 icons and historical spelling aliases are no longer available. Update your Pixel references to names in the current icon set.

Glyph codepoints may change on regeneration; always use Pixel constants with the matching bundled font rather than storing numeric codepoints.

--no-cache rebuilds even when the upstream commit matches, without bumping the version or adding a duplicate changelog entry. --force-release explicitly bumps the version for a release without upstream changes. --dry-run does not modify the project.

# From tool/
dart run bin/pixelarticons_tool.dart --project-root .. --no-cache
dart analyze
dart test
cd ..
dart format lib test tool/lib tool/bin tool/test example/lib
flutter analyze
flutter test
cd example
flutter build web

Compare every SVG against the font

Download the exact SVG revision pinned in pubspec.yaml, then render every SVG independently with flutter_svg and every bundled glyph with Flutter's Icon:

flutter pub get
rps sources
rps pixels

The comparison renders on a fixed 240×240 transparent canvas with white fills, then checks the painted/empty state at the center of each cell in the original 24×24 grid (alpha ≥ 128 means painted). It fails if any of the 576 cells differs. Sampling cell centers avoids antialiasing at grid edges while still detecting missing fills, extra fills, holes, and shifts that change cell occupancy. This checks pixel art cell occupancy, not exact outlines or subcell details. No alignment correction or image resizing is applied after rendering. SVG names and font names must match completely.

Results are saved in build/icon-comparison/report.json, including zero-based coordinates and painted states for every mismatched cell. Open build/icon-comparison/index.html for a searchable visual report. Grid images show binary occupancy; red marks cells missing in the font and blue marks extra cells. The report also retains exact raster differences as diagnostics; enable “Show icons with raster differences too” to inspect them. Those differences do not fail the grid comparison.

Sources are downloaded without changing the font, generated class, version, or changelog. This explicit diagnostic is separate from the ordinary flutter test suite so a fresh checkout needs no upstream download. The manual Compare SVGs and font grid GitHub Actions workflow runs the same check and uploads the report even when differences make the check fail.

CI and publishing

To release manually, open GitHub → Actions → Update icons and publish release → Run workflow. Select the release branch and click Run workflow. By default, this checks upstream, downloads the current icons, regenerates the font and class, bumps the version, updates the changelog, runs validation, and pushes the commit and version tag together. The tag then starts Publish package to pub.dev automatically. Follow that second workflow to confirm publication.

Manual runs always create a new version, even when upstream icons are unchanged. Scheduled runs on the 1st and 15th only release when upstream changes are found.

One-time setup: add the repository secret TAG_PAT with permission to write repository contents, and enable automated publishing on pub.dev for libsrcdev/pixelarticons with tag pattern v{{version}}. The release token must be authorized by any repository rules that restrict branch or tag pushes.

  • validate.yml analyzes and tests the tool and package, checks formatting, and builds the web example on pushes and pull requests.
  • publish-website.yml tests, builds, and deploys the demo and documentation website to GitHub Pages on pushes to main or manual dispatch. See the website publishing setup.
  • sync-upstream-icons.yml checks upstream on the 1st and 15th of each month or on manual dispatch, generates and validates artifacts, then commits and tags a release. Set the repository's TAG_PAT secret to a token authorized to push commits and tags; this allows the tag push to trigger the release workflow.
  • publish-pubdev.yml validates and publishes tagged releases using pub.dev OIDC automated publishing. Configure the trusted GitHub repository and tag pattern in the pub.dev package's automated publishing settings.

Remote issues addressed

  • #5: solid clock: the current path-based clock is bundled, with a raster test verifying its hollow interior and visible outline.
  • #6: new icons: the generated package includes 1,036 current free upstream icons. Paid upstream icons are not distributed here.

Contribute

Use the issues tab to discuss new features and bug reports.

About

Pixel Art Icons made simple for Flutter, powered by pixelarticons and fontify.

Topics

Resources

Stars

27 stars

Watchers

2 watching

Forks

Used by

Contributors

Languages