Modern Geometric Shapes Generator With JavaScript and SVG

Category: Javascript | May 1, 2023
Author:AbdKayali3
Views Total:379 views
Official Page:Go to website
Last Update:May 1, 2023
License:MIT

Preview:

Modern Geometric Shapes Generator With JavaScript and SVG

Description:

A JavaScript library that helps easily generate scalable, customizable, rotatable shapes (circles, triangles, rectangles, waves, etc) to create beautiful, eye-catching backgrounds for your website.

How to use it:

1. Download the package and load the following JavaScript files in the document.

<!-- Predefined SVG shapes -->
<script src="shapes.js"></script>
<!-- Main JavaScript -->
<script src="shapegenerator.js"></script>

2. Specify the element in which the shapes will be generated.

// the whole body
let element = document.body;

3. Set the number of shapes to generate.

let numberOfShapes = 5;

4. Determine whether to rotate shapes.

let rotation = true;

5. Specify the mode: 1 or 2.

  1. the shapes are generated in black color but have a colored rectangle shape with them on the corner
  2. the shapes are generated and colored from the colorList without any rectangles
let mode = 2;
let colorList = [
    // colors here
];

6. Generate the shapes.

generateShapes(element, colorList, numberOfShapes, mode, rotation);

Changelog:

05/01/2023

  • v1.0.1

03/02/2023

  • validating the last edit of changing the way we pass parameters and added more validation into it

You Might Be Interested In:


Leave a Reply