Skip to content

Animated SVG icon library

Pulsaricons

Over 24,000 animated marks in families of fifteen, each family with everyday tranches beside it.

An animated icon library by Business Nebula. Every mark is plain SVG and CSS you can paste into anything — themeable, reduced-motion aware, and drawn to sit comfortably in B2B software, SaaS and professional services.

Status: Pre-launch · free sets at pulsaricons.com

Free sets to start, with a credit line. Plans and the licence are on pulsaricons.com.

Browse pulsaricons.com (opens in a new tab)See the marks
Animated marks
24,000+
Specialist marks per family
15
Tech tiers: CSS, JS, GSAP
3
Browser tools beside the library
20

What it is

Pulsaricons is a library of animated SVG icons drawn as families rather than singles: a family is one design decision carried across a set of marks, meant to be used together. Each family keeps fifteen specialist marks and gains everyday tranches of twenty to twenty-five plain, broadly useful marks drawn in its own hand.

The catalogue is files in git — each mark is a directory of SVG, CSS, metadata and a poster — and pulsaricons.com builds its registry from those files at deploy time. Beside the library sit animated hero backgrounds and browser tools that hand you finished files.

Who it’s for

  • B2B software and SaaS teams who need motion that sits beside a data table, an invoice or an enterprise pricing page: restrained, geometric, precise.
  • Professional services firms building an ordinary product, website or slide deck.
  • Developers who want animation without a dependency: the default tier is pure CSS, with no script and no build step.

Key capabilities

Motion that communicates a state

Families, not singles

Fifteen specialist marks per family, plus an everyday tranche in the family’s own hand and a Glyphs tranche in one shared style built to read at 24px.

Seven design styles

Minimal line, bold line, technical, geometric solid, duotone, data mark and solid glyph — filterable alongside industry, use case and tech.

Three tech tiers

Pure CSS with no dependency, a small vanilla JavaScript tier, and GSAP for genuinely complex timelines.

Themeable with one variable

Structure is drawn in currentColor; the element the animation is about wears --pulsar-accent. Recolour a mark without touching its file.

Reduced motion, enforced

Every mark ships a reduced-motion block that rests the drawing in a sensible state, and the validators refuse an entry without one.

Safe to paste

Selectors scoped to the mark, ids prefixed with its slug, no scripts or external references in the SVG. At most 10 KB of SVG and 4 KB of CSS.

Live controls in the catalogue

Every entry gets a speed control, a loop toggle and, when themeable, a colour picker, driven through the Web Animations API.

Heroes and tools

Full-bleed animated hero backgrounds, and twenty generators — charts, cards, favicons, brand kits, backgrounds, decks — that hand you a real file.

From the catalogue

Sixteen marks, running live

These are real Pulsaricons marks, rendered from their own SVG and CSS files. Pick an accent to recolour every one through a single variable, the way the catalogue’s colour picker does.

Accent

  • Conversion point

    Minimal line

  • Bucket assignment

    A/B test bucket assignment

    Technical

  • A pillar page with an accent page sliding into its cluster and linking up

    Add to cluster

    Duotone

  • Customer data platform hub

    Bold line

  • Anycast Field

    Anycast field

    Geometric solid

  • Trend

    Data mark

  • Access audit

    Access audit

    Solid glyph

  • Keyword cannibalisation overlap

    Duotone

  • Accept

    Minimal line

  • A frame split by an accent seam into an A side and a B side

    A/B test

    Technical

  • Contact card

    Bold line

  • Add location

    Geometric solid

  • Adstock carryover from one spend impulse

    Adstock carryover

    Data mark

  • Ahead of plan

    Duotone

  • A person presenting a release on a board

    Release announcer

    Minimal line

  • Manual approval

    Manual approval

    Bold line

Sixteen marks from free sets, across all seven design styles. Over 24,000 more at pulsaricons.com.

Pick your tech

Three tiers, priced in dependencies

Each tier carries its adoption cost up front, because that is the question it answers: what does choosing this cost me?

CSS

No dependency

Paste the SVG and the stylesheet. No script, no build step, nothing to load. The default unless an animation genuinely has to be driven.

JS

One small script

A few lines of vanilla JavaScript, no library behind it. For motion that has to respond to something, or that keyframes cannot express.

GSAP

You supply GSAP

For timelines that are genuinely complex. GSAP is licensed by its own publisher rather than redistributed under the Pulsaricons licence.

Anatomy of a mark

Plain files, strict rules

No database holds the icons. Each mark is a directory, and every pull request runs validators that enforce the contract below before a person merges it.

animations/<slug>/

  • animation.svgThe drawing. Scoped class, slug-prefixed ids, an accessible title or aria-hidden.
  • animation.cssThe motion, for CSS and JS tiers. Every selector starts with the mark’s class.
  • animation.jsJS and GSAP tiers only. Play, pause, seek and destroy, time-driven.
  • meta.jsonName, tier, style, industries, use cases, tags, duration, and free or premium access.
  • poster.webpA generated still for previews.

Scoped

Every selector starts with .pulsar-<slug> and every keyframe name with the slug, so two marks never collide on one page.

Still when asked

A prefers-reduced-motion block names the same selectors that declared the motion, so it actually wins.

Paced

One cycle runs 3–6 seconds. Gestures ease; continuous loops are linear, so there is no stutter at the seam.

Small

At most 10 KB of SVG, 4 KB of CSS and 6 KB of script, committed as SVGO output.

How the catalogue grows

From claim to production

Every new mark takes the same path into the library.

  1. Claimed

    Work is claimed on a shared branch, so parallel work never collides.

  2. Drawn in its own worktree

    Each family is drawn to a written recipe and lands as one draft pull request.

  3. Checked by CI

    Validators for shape, motion, concepts, attribution and more, plus visual baselines recorded on Linux.

  4. Merged by a person

    Each merge to main is one production build on Vercel.

Tech stack

Built on

SVG + CSS animation
The default tier: no script, no build step
Vanilla JS & GSAP tiers
Time-driven, seekable, reduced-motion aware
Next.js
The pulsaricons.com web app
Neon
Postgres for customer data, Neon Auth for sign-in
Resend
Sign-in email, configured inside Neon Auth
Paddle
Payments, as merchant of record
Vercel
One production build per merge to main

Pulsaricons

Browse the whole library

Over 24,000 animated marks, the hero backgrounds and the tools are at pulsaricons.com, with free sets to start.

Visit pulsaricons.com (opens in a new tab)Pricing & licence (opens in a new tab)

Developed by BN

More we’ve built

Status: In-house · v1.0.0

WordPress theme framework

Project Mairan

The GSAP-powered Elementor child theme and design-token framework behind Business Nebula client projects.

Status: In-house · rolling out

WordPress site build & deployment

Project Orion

The standardised, git-managed WordPress build every new Business Nebula client site is spun up from.