https://github.com/anup-a/svg.shapes

Svg Shapes - A free, customizable & extensive collection of 100+ SVG shapes. Bring gradient magic into SVGs
https://github.com/anup-a/svg.shapes

design designtools shapes svelte svg tailwindcss tool

Last synced: 9 days ago
JSON representation

Svg Shapes - A free, customizable & extensive collection of 100+ SVG shapes. Bring gradient magic into SVGs

• Host: GitHub
• URL: https://github.com/anup-a/svg.shapes
• Owner: anup-a
• Created: 2023-02-25T14:29:14.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-01-20T07:33:29.000Z (10 months ago)
• Last Synced: 2024-10-15T03:23:39.410Z (23 days ago)
• Topics: design, designtools, shapes, svelte, svg, tailwindcss, tool
• Language: Svelte
• Homepage: https://svgshapes.in
• Size: 532 KB
• Stars: 51
• Watchers: 1
• Forks: 6
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        






## SVG · Shapes

SVG Shapes is a tiny tool that offers an extensive collection of 100+ common SVG shapes and with colors and gradients customizations.

- 📦 Copy and reuse without any attribution.

- 🌈 Magic like gradient fill on SVGs

- 🧵 All SVGS are pre-compressed with [SVGO](https://github.com/svg/svgo) 

- 🤖 100 % crafted by designers, not AI.




![Screenshot 2023-03-25 at 7 55 51 PM](https://user-images.githubusercontent.com/29516633/227723287-299a06f8-9932-41ca-aec2-4e63efa9aad2.png)




Also checkout 🚀 - [Creatica - Generate awesome vector svg backgrounds and patterns](https://creatica.app)




## Submit new SVGs

1. Clone the repo `git clone https://github.com/anup-a/svg.shapes/`

2. Go to `svg-parser` directory and run `npm install` or `yarn`

3. Add svgs to `factory/input` (make sure filename is unique) and run `npm run job` or `yarn job` (this will compress svgs and add it to the bundle.)

4. Create a new PR 🎉 




## SVG Credits

- [Monika Michalczyk](https://twitter.com/monmichalczyk)

- [Image by Macrovector](https://www.freepik.com/free-vector/sticky-stars-badge-set-icon-tag-label-symbol-blank-round-cloud_10601818.htm#query=svg%20shapes&position=5&from_view=search&track=ais)

## Website

SVG Shapes with Gradient Customization