xiry.

Design · Website

coolshapes

Open-source abstract shapes with grainy gradients for design and dev projects.

From the Xiry library · Updated 3 October 2026

Visit coolshap.es ↗

coolshapes is an open-source library of over 100 abstract vector shapes styled with grainy gradients. It allows designers and developers to grab assets as SVGs, PNGs, a ready-to-use Figma file, or a dedicated React component package under an MIT license.

What it's for

  • Drop decorative gradient shapes into Figma UI mockups
  • Render stylized vector shapes directly in React applications using a component package
  • Copy raw SVG or JSX code snippets straight into web templates

Features

  • 100+ abstract shapes across multiple categories like stars, circles, and polygons
  • Grainy gradient and noise texture styling
  • Direct SVG, JSX, and PNG copy/download options
  • Available as an installable React package (coolshapes-react)
  • Official Figma community file available for download
  • Licensed under MIT for personal and commercial projects

Pricing

Free and open-source (MIT license)

Details

Type
Website
Category
Design
Topic
Vector Assets
Open source
Yes
Platforms
Web, Code library
For
UI/UX designers, graphic designers, and front-end developers
Tags
shapes, abstract, gradients, svg, figma, react, open source

Why it was saved

  • @kalypsodesigns, 20 February 2025: Provides ready-to-use vector assets available as a Figma file, direct SVG downloads, or an installable React package under the MIT license.
  • @tura.creator, 10 December 2024: Enables designers to quickly copy and paste customizable abstract vector shapes into Figma or code for icons, logos, and UI accents.
  • @pJacquelDesign, 16 November 2025: Download as Figma file, download all, or React package; MIT license

Related

  • Iconoir

    Open-source icon library available across web frameworks, design tools, and SVG

  • Keyline Icons

    Free MIT-licensed icon library with four styles and two corner variants.

  • Shader Gradient

    Design tool for generating animated 3D moving gradients and web components.

  • Mage Icons

    Open-source icon system available for personal and commercial projects.

  • Stash Icons

    Open-source 24x24 SVG and React icon library across five styles.

  • Tabler Icons

    Over 6,200 free and open-source SVG icons for web projects.

Updated