{"loaderData":{"0":null,"0-17":{"tags":[{"name":"button","label":"Button","count":1289},{"name":"checkbox","label":"Checkbox","count":139},{"name":"loader","label":"Loader","count":732},{"name":"switch","label":"Switch","count":229},{"name":"card","label":"Card","count":648},{"name":"input","label":"Input","count":158},{"name":"radio-button","label":"Radio Button","count":37},{"name":"form","label":"Form","count":157},{"name":"pattern","label":"Pattern","count":83},{"name":"tooltip","label":"Tooltip","count":33},{"name":"twitter","label":"Twitter","count":5},{"name":"runjscollect","label":"RunJS Collect","count":10}]},"0-17-0":{"total":83,"projects":[{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"30b8eb","snapshot":"https://s1.qingting.work/runjs/7f4c7350b23c.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by themrsami","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":169,"pureCSS":1,"html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n background: repeating-linear-gradient(\n 45deg,\n #008080,\n #008080 10px,\n #20b2aa 10px,\n #20b2aa 20px\n );\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,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":664,"pureCSS":1,"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":"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,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":278,"pureCSS":1,"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":"56309b","snapshot":"https://s1.qingting.work/runjs/2b665b5267b3.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by themrsami","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":386,"pureCSS":1,"html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n background-image: linear-gradient(45deg, #3cb371 25%, transparent 25%),\n linear-gradient(-45deg, #3cb371 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #7cfc00 75%),\n linear-gradient(-45deg, transparent 75%, #7cfc00 75%);\n background-size: 100px 100px;\n background-position: 0 0, 50px 0, 50px -50px, 0px 50px;\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,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":989,"pureCSS":1,"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"},{"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,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":29,"jsLen":0,"cssLen":211,"pureCSS":1,"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":"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,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":388,"pureCSS":1,"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":"9b95a8","snapshot":"https://s1.qingting.work/runjs/1cc180964d43.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by bociKond","updated":"2024-01-22T19:24:19.000Z","isTemplate":1,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":1321,"pureCSS":1,"html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n background: radial-gradient(\n 50% 50% at 100% 0,\n #ca3f3f 0% 5%,\n #ffffff 6% 15%,\n #ca3f3f 16% 25%,\n #ffffff 26% 35%,\n #ca3f3f 36% 45%,\n #ffffff 46% 55%,\n #ca3f3f 56% 65%,\n #ffffff 66% 75%,\n #ca3f3f 76% 85%,\n #ffffff 86% 95%,\n #0000 96%\n ),\n radial-gradient(\n 50% 50% at 0 100%,\n #ca3f3f 0% 5%,\n #ffffff 6% 15%,\n #ca3f3f 16% 25%,\n #ffffff 26% 35%,\n #ca3f3f 36% 45%,\n #ffffff 46% 55%,\n #ca3f3f 56% 65%,\n #ffffff 66% 75%,\n #ca3f3f 76% 85%,\n #ffffff 86% 95%,\n #0000 96%\n ),\n radial-gradient(\n 50% 50%,\n #ca3f3f 0% 5%,\n #ffffff 6% 15%,\n #ca3f3f 16% 25%,\n #ffffff 26% 35%,\n #ca3f3f 36% 45%,\n #ffffff 46% 55%,\n #ca3f3f 56% 65%,\n #ffffff 66% 75%,\n #ca3f3f 76% 85%,\n #ffffff 86% 95%,\n #0000 96%\n ),\n radial-gradient(\n 50% 50%,\n #ca3f3f 0% 5%,\n #ffffff 6% 15%,\n #ca3f3f 16% 25%,\n #ffffff 26% 35%,\n #ca3f3f 36% 45%,\n #ffffff 46% 55%,\n #ca3f3f 56% 65%,\n #ffffff 66% 75%,\n #ca3f3f 76% 85%,\n #ffffff 86% 95%,\n #0000 96%\n )\n 38px 38px;\n background-size: 76px 76px;\n background-color: #ca3f3f;\n}\n"},{"created":"2024-01-22T17:22:21.000Z","isPrivate":0,"projectId":"aa76b5","snapshot":"https://s1.qingting.work/runjs/1cbf5dc830f3.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by theleaderofenemy","updated":"2024-01-22T19:24:21.000Z","isTemplate":1,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":989,"pureCSS":1,"html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n --s: 84px;\n --c1: #79994f;\n --c2: #717246;\n --c3: #3b3b06;\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"},{"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,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":603,"pureCSS":1,"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":"bc375c","snapshot":"https://s1.qingting.work/runjs/889b117ba454.png?x-oss-process=style/webp-w-500","tags":null,"title":"pattern by mobinkakei","updated":"2024-01-22T19:24:20.000Z","isTemplate":1,"relatedUrl":"","forkFrom":null,"htmlType":"html","htmlLen":30,"jsLen":0,"cssLen":491,"pureCSS":1,"html":"

\n","css":".container {\n width: 100%;\n height: 100%;\n /* Add your background pattern here */\n --s: 25px; /* control the size */\n --c1: #1eaaee;\n --c2: #171717;\n\n --c: #0000 71%, var(--c1) 0 79%, #0000 0;\n --_s: calc(var(--s) / 2) / calc(2 * var(--s)) calc(2 * var(--s));\n background: linear-gradient(45deg, var(--c)) calc(var(--s) / -2) var(--_s),\n linear-gradient(135deg, var(--c)) calc(var(--s) / 2) var(--_s),\n radial-gradient(var(--c1) 35%, var(--c2) 37%) 0 0 / var(--s) var(--s);\n}\n"}]}},"actionData":null,"errors":null}