@tsparticles/configs 3.0.0-beta.0

package/browser/p/polygonMask.js

@@ -0,0 +1,125 @@
+const options = {
+    name: "Polygon Mask",
+    interactivity: {
+        events: {
+            onClick: {
+                enable: false,
+                mode: "push",
+            },
+            onHover: {
+                enable: true,
+                mode: "bubble",
+                parallax: {
+                    enable: false,
+                    force: 2,
+                    smooth: 10,
+                },
+            },
+        },
+        modes: {
+            bubble: {
+                distance: 40,
+                duration: 2,
+                opacity: 8,
+                size: 6,
+            },
+            connect: {
+                distance: 80,
+                links: {
+                    opacity: 0.5,
+                },
+                radius: 60,
+            },
+            grab: {
+                distance: 400,
+                links: {
+                    opacity: 1,
+                },
+            },
+            push: {
+                quantity: 4,
+            },
+            remove: {
+                quantity: 2,
+            },
+            repulse: {
+                distance: 200,
+                duration: 0.4,
+            },
+            slow: {
+                active: false,
+                radius: 0,
+                factor: 1,
+            },
+        },
+    },
+    particles: {
+        color: {
+            value: "#ffffff",
+        },
+        links: {
+            blink: false,
+            color: "#ffffff",
+            consent: false,
+            distance: 30,
+            enable: true,
+            opacity: 0.4,
+            width: 1,
+        },
+        move: {
+            enable: true,
+            outModes: "bounce",
+            speed: 1,
+        },
+        number: {
+            limit: 0,
+            value: 200,
+        },
+        opacity: {
+            animation: {
+                enable: true,
+                speed: 2,
+                sync: false,
+            },
+            value: {
+                min: 0.05,
+                max: 0.4,
+            },
+        },
+        shape: {
+            type: "circle",
+        },
+        size: {
+            value: 1,
+        },
+    },
+    polygon: {
+        draw: {
+            enable: true,
+            lineColor: "rgba(255,255,255,0.2)",
+            lineWidth: 1,
+        },
+        enable: true,
+        move: {
+            radius: 10,
+        },
+        position: {
+            x: 50,
+            y: 50,
+        },
+        inline: {
+            arrangement: "equidistant",
+        },
+        scale: 0.5,
+        type: "inline",
+        url: "https://particles.js.org/images/smalldeer.svg",
+    },
+    background: {
+        color: "#000000",
+        image: "",
+        position: "50% 50%",
+        repeat: "no-repeat",
+        size: "cover",
+    },
+};
+export default options;

package/browser/p/polygons.js

@@ -0,0 +1,136 @@
+const options = {
+    name: "Polygon Shape",
+    particles: {
+        number: {
+            value: 80,
+            density: {
+                enable: true,
+            },
+        },
+        color: {
+            value: "#ffffff",
+        },
+        shape: {
+            type: "polygon",
+            options: {
+                polygon: [
+                    {
+                        sides: 3,
+                        particles: {
+                            opacity: {
+                                value: {
+                                    min: 0.5,
+                                    max: 0.8,
+                                },
+                            },
+                            size: {
+                                value: {
+                                    min: 10,
+                                    max: 12,
+                                },
+                            },
+                            color: {
+                                value: "ff0",
+                            },
+                        },
+                    },
+                    {
+                        sides: 5,
+                        particles: {
+                            opacity: {
+                                value: 0.5,
+                            },
+                            size: {
+                                value: 8,
+                            },
+                            color: {
+                                value: "0f0",
+                            },
+                        },
+                    },
+                    {
+                        sides: 8,
+                        particles: {
+                            opacity: {
+                                value: 1,
+                            },
+                            size: {
+                                value: {
+                                    min: 15,
+                                    max: 20,
+                                },
+                            },
+                            color: {
+                                value: "f00",
+                            },
+                        },
+                    },
+                ],
+            },
+        },
+        opacity: {
+            value: 0.5,
+        },
+        size: {
+            value: {
+                min: 1,
+                max: 5,
+            },
+        },
+        links: {
+            enable: true,
+            distance: 150,
+            color: "#ffffff",
+            opacity: 0.4,
+            width: 1,
+        },
+        move: {
+            enable: true,
+            speed: 2,
+        },
+    },
+    interactivity: {
+        events: {
+            onHover: {
+                enable: true,
+                mode: "bubble",
+                parallax: {
+                    enable: false,
+                    force: 60,
+                    smooth: 10,
+                },
+            },
+            onClick: {
+                enable: true,
+                mode: "push",
+            },
+        },
+        modes: {
+            grab: {
+                distance: 400,
+                links: {
+                    opacity: 1,
+                },
+            },
+            bubble: {
+                distance: 400,
+                size: 40,
+                duration: 2,
+                opacity: 0.8,
+            },
+            repulse: {
+                distance: 200,
+            },
+            push: {
+                quantity: 4,
+            },
+            remove: {
+                quantity: 2,
+            },
+        },
+    },
+    background: {
+        color: "#0d47a1",
+    },
+};
+export default options;

package/browser/q/index.js

@@ -0,0 +1 @@
+export default {};

package/browser/r/index.js

@@ -0,0 +1,40 @@
+import random from "./random";
+import reactBubbles from "./reactBubbles";
+import reactDefaults from "./reactDefaults";
+import reactMultipleImages from "./reactMultipleImages";
+import reactNightSky from "./reactNightSky";
+import reactPolygonMask from "./reactPolygonMask";
+import reactSimple from "./reactSimple";
+import reactSnow from "./reactSnow";
+import reduceDuplicates from "./reduceDuplicates";
+import repulse from "./repulse";
+import repulseBack from "./repulseBack";
+import repulseCirc from "./repulseCirc";
+import repulseCubic from "./repulseCubic";
+import repulseExpo from "./repulseExpo";
+import repulseQuart from "./repulseQuart";
+import repulseQuint from "./repulseQuint";
+import repulseSine from "./repulseSine";
+import responsive from "./responsive";
+import ring from "./ring";
+export default {
+    random,
+    reactBubbles,
+    reactDefaults,
+    reactMultipleImages,
+    reactNightSky,
+    reactPolygonMask,
+    reactSimple,
+    reactSnow,
+    reduceDuplicates,
+    repulse,
+    repulseBack,
+    repulseCirc,
+    repulseCubic,
+    repulseExpo,
+    repulseQuart,
+    repulseQuint,
+    repulseSine,
+    responsive,
+    ring,
+};

package/browser/r/random.js

@@ -0,0 +1,96 @@
+const options = {
+    name: "Random Colors",
+    interactivity: {
+        events: {
+            onClick: {
+                enable: true,
+                mode: "push",
+            },
+            onHover: {
+                enable: true,
+                mode: "connect",
+                parallax: {
+                    enable: false,
+                    force: 60,
+                    smooth: 10,
+                },
+            },
+        },
+        modes: {
+            bubble: {
+                distance: 400,
+                duration: 2,
+                opacity: 0.8,
+                size: 40,
+            },
+            connect: {
+                distance: 80,
+                links: {
+                    opacity: 0.5,
+                },
+                radius: 60,
+            },
+            grab: {
+                distance: 400,
+                links: {
+                    opacity: 1,
+                },
+            },
+            push: {
+                quantity: 4,
+            },
+            remove: {
+                quantity: 2,
+            },
+            repulse: {
+                distance: 200,
+                duration: 0.4,
+            },
+        },
+    },
+    particles: {
+        color: {
+            value: "random",
+        },
+        links: {
+            blink: false,
+            color: "#ffffff",
+            consent: false,
+            distance: 150,
+            enable: false,
+            opacity: 0.4,
+            width: 1,
+        },
+        move: {
+            enable: true,
+            speed: 6,
+        },
+        number: {
+            density: {
+                enable: true,
+            },
+            limit: 500,
+            value: 300,
+        },
+        opacity: {
+            value: 0.5,
+        },
+        shape: {
+            type: "circle",
+        },
+        size: {
+            value: {
+                min: 10,
+                max: 15,
+            },
+        },
+    },
+    background: {
+        color: "#000000",
+        image: "",
+        position: "50% 50%",
+        repeat: "no-repeat",
+        size: "cover",
+    },
+};
+export default options;

package/browser/r/reactBubbles.js

@@ -0,0 +1,106 @@
+const options = {
+    name: "React Bubbles",
+    interactivity: {
+        events: {
+            onClick: {
+                enable: true,
+                mode: "repulse",
+            },
+            onHover: {
+                enable: true,
+                mode: "bubble",
+            },
+        },
+        modes: {
+            bubble: {
+                distance: 250,
+                duration: 2,
+                opacity: 0,
+                size: 0,
+            },
+            connect: {
+                distance: 80,
+                links: {
+                    opacity: 0.5,
+                },
+                radius: 60,
+            },
+            grab: {
+                distance: 180,
+                links: {
+                    opacity: 0.35,
+                },
+            },
+            push: {
+                quantity: 4,
+            },
+            remove: {
+                quantity: 2,
+            },
+            repulse: {
+                distance: 200,
+                duration: 4,
+            },
+            slow: {
+                factor: 1,
+                radius: 0,
+            },
+        },
+    },
+    particles: {
+        color: {
+            value: "#FFF",
+        },
+        collisions: {
+            enable: true,
+        },
+        move: {
+            attract: {
+                enable: false,
+                rotate: {
+                    x: 3000,
+                    y: 3000,
+                },
+            },
+            direction: "top",
+            enable: true,
+            speed: {
+                min: 0.1,
+                max: 1,
+            },
+        },
+        number: {
+            limit: -1,
+            value: 160,
+        },
+        opacity: {
+            animation: {
+                enable: true,
+                speed: 1,
+                sync: false,
+            },
+            value: {
+                min: 0.1,
+                max: 0.5,
+            },
+        },
+        shape: {
+            type: "circle",
+        },
+        size: {
+            value: {
+                min: 1,
+                max: 3,
+            },
+        },
+    },
+    pauseOnBlur: true,
+    background: {
+        color: "#0d47a1",
+        image: "",
+        position: "50% 50%",
+        repeat: "no-repeat",
+        size: "cover",
+    },
+};
+export default options;

package/browser/r/reactDefaults.js

@@ -0,0 +1,52 @@
+const options = {
+    name: "React Defaults",
+    particles: {
+        number: {
+            value: 40,
+        },
+        color: {
+            value: "#FFF",
+        },
+        shape: {
+            type: "circle",
+        },
+        opacity: {
+            value: {
+                min: 0.1,
+                max: 0.5,
+            },
+            animation: {
+                enable: true,
+                speed: 1,
+                sync: false,
+            },
+        },
+        size: {
+            value: 1,
+        },
+        links: {
+            enable: true,
+            distance: 150,
+            color: "#FFF",
+            opacity: 0.6,
+            width: 1,
+            shadow: {
+                enable: false,
+                blur: 5,
+                color: "lime",
+            },
+        },
+        move: {
+            enable: true,
+            speed: 3,
+            outModes: "bounce",
+        },
+        collisions: {
+            enable: true,
+        },
+    },
+    background: {
+        color: "#0d47a1",
+    },
+};
+export default options;

package/browser/r/reactMultipleImages.js

@@ -0,0 +1,92 @@
+const options = {
+    name: "React Multiple Images",
+    particles: {
+        color: {
+            value: "#CCC",
+        },
+        collisions: {
+            enable: true,
+        },
+        links: {
+            blink: false,
+            color: "#fff",
+            consent: false,
+            distance: 150,
+            enable: false,
+            opacity: 0.6,
+            width: 1,
+        },
+        move: {
+            enable: true,
+            speed: 1,
+        },
+        number: {
+            density: {
+                enable: true,
+            },
+            value: 8,
+        },
+        opacity: {
+            animation: {
+                enable: true,
+                speed: 1,
+                sync: false,
+            },
+            value: {
+                min: 0.1,
+                max: 0.5,
+            },
+        },
+        shape: {
+            options: {
+                image: [
+                    {
+                        height: 20,
+                        replaceColor: true,
+                        src: "https://particles.js.org/images/fruits/cherry.png",
+                        width: 23,
+                        fill: true,
+                        close: true,
+                    },
+                    {
+                        height: 20,
+                        replaceColor: true,
+                        src: "https://particles.js.org/images/fruits/grapes.png",
+                        width: 20,
+                        fill: true,
+                        close: true,
+                    },
+                    {
+                        height: 20,
+                        replaceColor: true,
+                        src: "https://particles.js.org/images/fruits/lemon.png",
+                        width: 20,
+                        fill: true,
+                        close: true,
+                    },
+                ],
+            },
+            type: ["image", "circle"],
+        },
+        size: {
+            animation: {
+                enable: true,
+                speed: 4,
+                sync: false,
+            },
+            value: {
+                min: 10,
+                max: 30,
+            },
+        },
+    },
+    pauseOnBlur: true,
+    background: {
+        color: "#0d47a1",
+        image: "",
+        position: "50% 50%",
+        repeat: "no-repeat",
+        size: "cover",
+    },
+};
+export default options;