{"loaderData":{"0":null,"0-2":{"total":6509,"projects":[{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"4b8adb","snapshot":"https://s1.qingting.work/runjs/cc0ddf0ef0a8.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by catraco","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":278,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n background-image: repeating-conic-gradient(\n from 0deg,\n orangered,\n transparent 10deg,\n orange 10deg,\n orangered 20deg\n );\n background-size: 100% 100%;\n background-repeat: no-repeat;\n background-color: orange;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"7667c1","snapshot":"https://s1.qingting.work/runjs/c64c8518543e.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by elijahgummer","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":631,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n position: relative;\n background: #f0f0f0;\n}\n\n.container::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 45deg,\n #6ab5b9 25%,\n transparent 25%,\n transparent 50%,\n #6ab5b9 50%,\n #6ab5b9 75%,\n transparent 75%,\n transparent\n ),\n linear-gradient(\n -45deg,\n #6ab5b9 25%,\n transparent 25%,\n transparent 50%,\n #6ab5b9 50%,\n #6ab5b9 75%,\n transparent 75%,\n transparent\n );\n background-size: 20px 20px;\n opacity: 0.8;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"f2fbf9","snapshot":"https://s1.qingting.work/runjs/62d0f265c5be.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by catraco","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":256,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n background-image: repeating-linear-gradient(\n -45deg,\n orange 0,\n transparent 30px,\n orangered 30px,\n transparent 60px,\n orange 120px,\n transparent 240px\n );\n background-color: orange;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"6de8e6","snapshot":"https://s1.qingting.work/runjs/21f14ac273e9.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by themrsami","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":29,"cssLen":309,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

","css":".container {\n width: 100%;\n height: 100%;\n background-color: purple;\n background-image: linear-gradient(45deg, transparent 33.3%, orange 33.3%, orange 66.6%, transparent 66.6%),\n linear-gradient(-45deg, transparent 33.3%, orange 33.3%, orange 66.6%, transparent 66.6%);\n background-size: 60px 60px;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"487d53","snapshot":"https://s1.qingting.work/runjs/126f39578d7a.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by csemszepp","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":664,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n --s: 125px; /* control the size */\n --c1: #f8ca00;\n --c2: #bd1550;\n\n --_g: var(--c1) 90deg, var(--c2) 0 135deg, #0000 0;\n background: conic-gradient(\n from -45deg at calc(100% / 3) calc(100% / 3),\n var(--c1) 90deg,\n #0000 0\n ),\n conic-gradient(from -135deg at calc(100% / 3) calc(2 * 100% / 3), var(--_g)),\n conic-gradient(\n from 135deg at calc(2 * 100% / 3) calc(2 * 100% / 3),\n var(--_g)\n ),\n conic-gradient(\n from 45deg at calc(2 * 100% / 3) calc(100% / 3),\n var(--_g),\n var(--c1) 0 225deg,\n var(--c2) 0\n );\n background-size: var(--s) var(--s);\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"628293","snapshot":"https://s1.qingting.work/runjs/2f1f3bc2c837.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by catraco","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":388,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 45deg,\n orange 25%,\n orangered 25%,\n orange 75%,\n orangered 75%,\n orange\n ),\n linear-gradient(\n 45deg,\n orange 25%,\n orangered 25%,\n orange 75%,\n orangered 75%,\n orange\n );\n background-size: 5em 10em;\n background-position: 0 0, 10px 10px;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"20a620","snapshot":"https://s1.qingting.work/runjs/a3d6cd667c5e.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by Efrain2112","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":787,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n --size: 150px; /* control the size */\n --color: #d1bdbd;\n\n background: radial-gradient(\n circle at 15% 30%,\n transparent 40%,\n var(--color) 41%\n ),\n radial-gradient(circle at 85% 30%, transparent 40%, var(--color) 41%),\n radial-gradient(circle at 50% 70%, transparent 40%, var(--color) 41%),\n radial-gradient(circle at 15% 70%, transparent 40%, var(--color) 41%),\n radial-gradient(circle at 85% 70%, transparent 40%, var(--color) 41%),\n linear-gradient(\n 45deg,\n var(--color) 25%,\n rgba(0, 0, 0, 0.067) 0,\n rgba(0, 0, 0, 0.067) 50%,\n var(--color) 0,\n var(--color) 75%,\n #1111 0,\n #1111 100%,\n var(--color) 0\n );\n background-size: var(--size) var(--size);\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"e425fd","snapshot":"https://s1.qingting.work/runjs/d30da5c9aa02.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by alexruix","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":464,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n /* Add your background pattern here */\n --size: 80px; /* control the size */\n --color: #fefae0;\n\n --l: var(--color) 20%, #0000 0;\n --bg: 35%, #606c38 0 45%, var(--color) 0;\n background: linear-gradient(45deg, var(--l) 45%, var(--color) 0 70%, #0000 0),\n linear-gradient(-45deg, var(--l) var(--bg) 70%, #0000 0),\n linear-gradient(45deg, var(--color) var(--bg));\n background-size: var(--size) var(--size);\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"aee856","snapshot":"https://s1.qingting.work/runjs/82e1fd24de42.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by kandalgaonkarshubham","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":603,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n --s: 37px; /* control the size */\n\n --c: #0000, #282828 0.5deg 119.5deg, #0000 120deg;\n --g1: conic-gradient(from 60deg at 56.25% calc(425% / 6), var(--c));\n --g2: conic-gradient(from 180deg at 43.75% calc(425% / 6), var(--c));\n --g3: conic-gradient(from -60deg at 50% calc(175% / 12), var(--c));\n background: var(--g1), var(--g1) var(--s) calc(1.73 * var(--s)), var(--g2),\n var(--g2) var(--s) calc(1.73 * var(--s)), var(--g3) var(--s) 0,\n var(--g3) 0 calc(1.73 * var(--s)) #1e1e1e;\n background-size: calc(2 * var(--s)) calc(3.46 * var(--s));\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"5f6f2f","snapshot":"https://s1.qingting.work/runjs/ed1cc3e78f5d.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by Ratinax","updated":"2024-01-22T19:24:21.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":29,"cssLen":211,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

","css":".container {\n width: 100%;\n height: 100%;\n background-image: linear-gradient(220deg, lime 1%, transparent),\n linear-gradient(220deg, yellow 50%, transparent);\n background-size: 4em 4em;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"18c184","snapshot":"https://s1.qingting.work/runjs/1a8ecc453965.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by SmookyDev","updated":"2024-01-22T19:24:21.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":986,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n /* Add your background pattern here */\n background: linear-gradient(\n 45deg,\n #0000 calc(25% / 3),\n #ffffff 0 calc(50% / 3),\n #0000 0 calc(250% / 3),\n #ffffff 0 calc(275% / 3),\n #0000 0\n ),\n linear-gradient(\n 45deg,\n #ffffff calc(25% / 3),\n #0000 0 calc(50% / 3),\n #ffffff 0 25%,\n #0000 0 75%,\n #ffffff 0 calc(250% / 3),\n #0000 0 calc(275% / 3),\n #ffffff 0\n ),\n linear-gradient(\n -45deg,\n #0000 calc(25% / 3),\n #ffffff 0 calc(50% / 3),\n #0000 0 calc(250% / 3),\n #ffffff 0 calc(275% / 3),\n #0000 0\n ),\n linear-gradient(\n -45deg,\n #ffffff calc(25% / 3),\n #0000 0 calc(50% / 3),\n #ffffff 0 25%,\n #0000 0 75%,\n #ffffff 0 calc(250% / 3),\n #0000 0 calc(275% / 3),\n #ffffff 0\n )\n #c77979;\n background-size: 106px 106px;\n background-position: 0 0, 53px 53px;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"5dc836","snapshot":"https://s1.qingting.work/runjs/e1e0cc2b5abd.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by csemszepp","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":30,"cssLen":989,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n --s: 84px;\n --c1: #f2f2f2;\n --c2: #cdcbcc;\n --c3: #999999;\n\n --_g: 0 120deg, #0000 0;\n background: conic-gradient(\n from 0deg at calc(500% / 6) calc(100% / 3),\n var(--c3) var(--_g)\n ),\n conic-gradient(\n from -120deg at calc(100% / 6) calc(100% / 3),\n var(--c2) var(--_g)\n ),\n conic-gradient(\n from 120deg at calc(100% / 3) calc(500% / 6),\n var(--c1) var(--_g)\n ),\n conic-gradient(\n from 120deg at calc(200% / 3) calc(500% / 6),\n var(--c1) var(--_g)\n ),\n conic-gradient(\n from -180deg at calc(100% / 3) 50%,\n var(--c2) 60deg,\n var(--c1) var(--_g)\n ),\n conic-gradient(\n from 60deg at calc(200% / 3) 50%,\n var(--c1) 60deg,\n var(--c3) var(--_g)\n ),\n conic-gradient(\n from -60deg at 50% calc(100% / 3),\n var(--c1) 120deg,\n var(--c2) 0 240deg,\n var(--c3) 0\n );\n background-size: calc(var(--s) * 1.732) var(--s);\n}\n"}]}},"actionData":null,"errors":null}