The Wiki Camp 2 Jr. - User contributions [en]

Template:Testing.css

2025-05-21T23:30:44Z

Pseudosphere: Pseudosphere changed the content model of the page Template:Testing.css from "wikitext" to "CSS"

.grongle a.external {
background: url("https://camp2jr.objectshow.community/images/f/f0/The_grongle_gang.png");
display: inline-flex;
height: 200px;
align-items: center;
font-weight: bold;
text-shadow: 1px 0 #FFF, -1px 0 #FFF, 0 1px #FFF, 0 -1px #FFF;
}

Template:Testing.css

2025-05-21T23:30:26Z

Pseudosphere: Created page with ".grongle a.external { background: url("https://camp2jr.objectshow.community/images/f/f0/The_grongle_gang.png"); display: inline-flex; height: 200px; align-items: center; font-weight: bold; text-shadow: 1px 0 #FFF, -1px 0 #FFF, 0 1px #FFF, 0 -1px #FFF; }"

User:Pseudosphere/Test Page

2025-03-03T09:50:53Z

Pseudosphere:

{{#css:
@supports selector(::-webkit-scrollbar) {
::-webkit-scrollbar {
background: #AAA;
height: 18px;
width: 18px;
}
::-webkit-scrollbar-track {
border: 1px #AAA;
background: #808080;
margin: 1px;
}
::-webkit-scrollbar-track:horizontal {
border-style: solid none;
}
::-webkit-scrollbar-track:vertical {
border-style: none solid;
}
::-webkit-scrollbar-thumb {
background: linear-gradient(#0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(to right, #0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(#FFF 1px, #0000 1px), linear-gradient(to right, #FFF 1px, #0000 1px, #0000 calc(100% - 2px), #555 calc(100% - 2px)), linear-gradient(#0000 calc(100% - 2px), #555 calc(100% - 2px)), radial-gradient(circle, #0000 3px, #AAA 3px), linear-gradient(135deg, #000 calc(50% - 3px), #151515 calc(50% - 1.5px), #959595 50%, #F4F4F4 calc(50% + 1.5px), #FFF calc(50% + 3px)) #AAA;
border: 1px #AAA;
height: 16px;
width: 16px;
}
::-webkit-scrollbar-thumb:horizontal {
border-style: solid none;
}
::-webkit-scrollbar-thumb:vertical {
border-style: none solid;
}
::-webkit-scrollbar-button {
background: linear-gradient(#0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(to right, #0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(#FFF 1px, #0000 1px), linear-gradient(to right, #FFF 1px, #0000 1px, #0000 calc(100% - 2px), #555 calc(100% - 2px)), linear-gradient(#0000 calc(100% - 2px), #555 calc(100% - 2px)) #AAA;
border: 1px solid #AAA;
}
::-webkit-scrollbar-button:active {
background-color: #FFF;
}
::-webkit-scrollbar-button:horizontal {
border-style: solid solid solid none;
height: 18px;
width: 17px;
}
::-webkit-scrollbar-button:vertical {
border-style: none solid solid;
height: 17px;
width: 18px;
}
::-webkit-scrollbar-button:disabled, ::-webkit-scrollbar-button:start {
display: none;
}
::-webkit-scrollbar-button:end:decrement:enabled {
display: block;
}
::-webkit-scrollbar-corner {
background: #AAA;
}
}
@supports not selector(::-webkit-scrollbar) {
* {
scrollbar-color: #AAA #808080;
}
}
}}
<div style="border: 1px solid #000; height: 512px; overflow: scroll; resize: horizontal;">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqu{{Loop|128|a}}.</p>
{{Loop|16|<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>}}
</div>
[[Category:Functional pages]]

User:Pseudosphere/Test Page

2025-03-03T09:48:05Z

Pseudosphere:

{{#css:
.NS {
border: 1px solid #000;
}
@supports selector(::-webkit-scrollbar) {
.NS::-webkit-scrollbar {
background: #AAA;
height: 18px;
width: 18px;
}
.NS::-webkit-scrollbar-track {
border: 1px #AAA;
background: #808080;
margin: 1px;
}
.NS::-webkit-scrollbar-track:horizontal {
border-style: solid none;
}
.NS::-webkit-scrollbar-track:vertical {
border-style: none solid;
}
.NS::-webkit-scrollbar-thumb {
background: linear-gradient(#0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(to right, #0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(#FFF 1px, #0000 1px), linear-gradient(to right, #FFF 1px, #0000 1px, #0000 calc(100% - 2px), #555 calc(100% - 2px)), linear-gradient(#0000 calc(100% - 2px), #555 calc(100% - 2px)), radial-gradient(circle, #0000 3px, #AAA 3px), linear-gradient(135deg, #000 calc(50% - 3px), #151515 calc(50% - 1.5px), #959595 50%, #F4F4F4 calc(50% + 1.5px), #FFF calc(50% + 3px)) #AAA;
border: 1px #AAA;
height: 16px;
width: 16px;
}
.NS::-webkit-scrollbar-thumb:horizontal {
border-style: solid none;
}
.NS::-webkit-scrollbar-thumb:vertical {
border-style: none solid;
}
.NS::-webkit-scrollbar-button {
background: linear-gradient(#0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(to right, #0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(#FFF 1px, #0000 1px), linear-gradient(to right, #FFF 1px, #0000 1px, #0000 calc(100% - 2px), #555 calc(100% - 2px)), linear-gradient(#0000 calc(100% - 2px), #555 calc(100% - 2px)) #AAA;
border: 1px solid #AAA;
}
.NS::-webkit-scrollbar-button:active {
background-color: #FFF;
}
.NS::-webkit-scrollbar-button:horizontal {
border-style: solid solid solid none;
height: 18px;
width: 17px;
}
.NS::-webkit-scrollbar-button:vertical {
border-style: none solid solid;
height: 17px;
width: 18px;
}
.NS::-webkit-scrollbar-button:disabled, .NS::-webkit-scrollbar-button:start {
display: none;
}
.NS::-webkit-scrollbar-button:end:decrement:enabled {
display: block;
}
.NS::-webkit-scrollbar-corner {
background: #AAA;
}
}
@supports not selector(::-webkit-scrollbar) {
.NS {
scrollbar-color: #AAA #808080;
}
}
}}
<div class="NS" style="height: 512px; overflow: scroll; resize: horizontal;">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqu{{Loop|128|a}}.</p>
{{Loop|16|<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>}}
</div>
[[Category:Functional pages]]

User:Pseudosphere/Test Page

2025-03-03T07:12:23Z

Pseudosphere:

{{#css:
.NS {
border: 1px solid #000;
}
@supports selector(::-webkit-scrollbar) {
.NS::-webkit-scrollbar {
background: #AAA;
height: 18px;
width: 18px;
}
.NS::-webkit-scrollbar-track {
border: 1px #AAA;
background: #808080;
margin: 1px;
}
.NS::-webkit-scrollbar-track:horizontal {
border-style: solid none;
}
.NS::-webkit-scrollbar-track:vertical {
border-style: none solid;
}
.NS::-webkit-scrollbar-thumb {
background: linear-gradient(#0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(to right, #0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(#FFF 1px, #0000 1px), linear-gradient(to right, #FFF 1px, #0000 1px, #0000 calc(100% - 2px), #555 calc(100% - 2px)), linear-gradient(#0000 calc(100% - 2px), #555 calc(100% - 2px)), radial-gradient(circle, #0000 3px, #AAA 3px), linear-gradient(135deg, #000 calc(50% - 3px), #151515 calc(50% - 1.5px), #959595 50%, #F4F4F4 calc(50% + 1.5px), #FFF calc(50% + 3px)) #AAA;
border: 1px #AAA;
height: 16px;
width: 16px;
}
.NS::-webkit-scrollbar-thumb:horizontal {
border-style: solid none;
}
.NS::-webkit-scrollbar-thumb:vertical {
border-style: none solid;
}
.NS::-webkit-scrollbar-button {
background: linear-gradient(#0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(to right, #0000, #0000 calc(100% - 1px), #000 calc(100% - 1px)), linear-gradient(#FFF 1px, #0000 1px), linear-gradient(to right, #FFF 1px, #0000 1px, #0000 calc(100% - 2px), #555 calc(100% - 2px)), linear-gradient(#0000 calc(100% - 2px), #555 calc(100% - 2px)) #AAA;
border: 1px solid #AAA;
}
.NS::-webkit-scrollbar-button:active {
background-color: #FFF;
}
.NS::-webkit-scrollbar-button:horizontal {
border-style: solid none solid solid;
height: 18px;
width: 17px;
}
.NS::-webkit-scrollbar-button:vertical {
border-style: none solid solid;
height: 17px;
width: 18px;
}
.NS::-webkit-scrollbar-button:disabled, .NS::-webkit-scrollbar-button:horizontal:end, .NS::-webkit-scrollbar-button:vertical:start {
display: none;
}
.NS::-webkit-scrollbar-button:horizontal:start:increment:enabled, .NS::-webkit-scrollbar-button:vertical:end:decrement:enabled {
display: block;
}
.NS::-webkit-scrollbar-corner {
background: #AAA;
}
}
@supports not selector(::-webkit-scrollbar) {
.NS {
scrollbar-color: #AAA #808080;
}
}
}}
<div class="NS" style="height: 512px; overflow: scroll; resize: horizontal;">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqu{{Loop|128|a}}.</p>
{{Loop|16|<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>}}
</div>
[[Category:Functional pages]]

User:Pseudosphere/Test Page

2025-03-02T07:34:15Z

Pseudosphere:

{{#css:
.testy {
background: #000;
color: #FFF;
font-weight: bold;
height: 256px;
overflow: scroll;
}

@supports selector(::-webkit-scrollbar) {
:is(html, .testy)::-webkit-scrollbar {
width: 40px;
background: #0FF;
border: 6px solid #F00;
outline: 12px solid #0F0;
}
:is(html, .testy)::-webkit-scrollbar-thumb {
background: #FF0;
border: 3px solid #00F;
outline: 4px solid #F0F;
}
}
@supports not selector(::-webkit-scrollbar) {
html, .testy {
scrollbar-color: red blue;
}
}
}}<div class="testy">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqu{{Loop|4096|a}}.

{{Loop|16|Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>}}
</div>
{{#css:
.NS {
border: 1px solid transparent;
outline: 1px solid #000;
}
@supports selector(::-webkit-scrollbar) {
.NS::-webkit-scrollbar {
background: #808080;
box-shadow: -2px -2px #000;
outline: 1px solid #AAA;
width: 16px;
}
.NS::-webkit-scrollbar-thumb {
background: #AAA;
border: solid;
border-color: #FFF #555 #555 #FFF;
border-style: solid ridge ridge solid;
border-width: 1px 2px 2px 1px;
width: 8px;
}
}
@supports not selector(::-webkit-scrollbar) {
.NS {
scrollbar-color: #AAA #808080;
}
}
}}
<div class="NS" style="height: 512px; margin-top: 64px; overflow: scroll;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqu{{Loop|4096|a}}.

{{Loop|16|Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>}}
</div>
[[Category:Functional pages]]

User:Pseudosphere/Test.css

2025-03-02T07:07:35Z

Pseudosphere:

.NS {
background-image: url("https://camp2jr.objectshow.community/images/3/38/Pfpstupidsmall.png");
background-size: 0;
}

User:Pseudosphere/Test.css

2025-03-02T06:56:38Z

Pseudosphere:

.NS::-webkit-scrollbar-thumb {
background-image: url("https://camp2jr.objectshow.community/images/3/38/Pfpstupidsmall.png");
}

User:Pseudosphere/Test.css

2025-03-02T06:54:37Z

Pseudosphere: Created page with "@supports selector(::-webkit-scrollbar) { .NS::-webkit-scrollbar-thumb { background-image: url("https://camp2jr.objectshow.community/images/3/38/Pfpstupidsmall.png"); } }"

@supports selector(::-webkit-scrollbar) {
.NS::-webkit-scrollbar-thumb {
background-image: url("https://camp2jr.objectshow.community/images/3/38/Pfpstupidsmall.png");
}
}

User:Pseudosphere/Test Page

2025-02-28T00:47:51Z

Pseudosphere: Created page with "{{#css: .testy { background: #000; color: #FFF; font-weight: bold; height: 256px; overflow: scroll; } @supports selector(::-webkit-scrollbar) { :is(html, .testy)::-webkit-scrollbar { width: 40px; background: #0FF; border: 6px solid #F00; outline: 12px solid #0F0; } :is(html, .testy)::-webkit-scrollbar-thumb { background: #FF0; border: 3px solid #00F; outline: 4px solid #F0F; } } @supports not selector(::-webkit-scrollbar) { html, .testy { scrollbar-color: red blue; } }..."

File:DiaZZUnknown.png

2025-02-01T00:37:15Z

Pseudosphere:

Template:DiaNone

2025-02-01T00:35:35Z

Pseudosphere: Created page with "{| style="max-width:500px; margin-bottom:10px; border:7px solid rgba(200, 200, 200, 0); color:#000; background-color: rgba(200, 200, 200, 0.58); text-align:center; font-size:8pt; overflow-wrap:break-word;" |- | valign="top" |<div style="overflow:hidden; width:90px; height:90px; background:#CC6FCE"> }}} </div> | valign="top" |<div style="margin-top:0px; margin-left:12px; width:220px; font-size:14pt; font-variant:small-caps; text..."

{| style="max-width:500px; margin-bottom:10px; border:7px solid rgba(200, 200, 200, 0); color:#000; background-color: rgba(200, 200, 200, 0.58); text-align:center; font-size:8pt; overflow-wrap:break-word;"
|-
| valign="top" |<div style="overflow:hidden; width:90px; height:90px; background:#CC6FCE">
[[File:DiaZZUnknown.png|80px|link={{{link|}}}]]
</div>
| valign="top" |<div style="margin-top:0px; margin-left:12px; width:220px; font-size:14pt; font-variant:small-caps; text-align:left;">'''{{{character|{{{1}}}}}}'''</div>
<div style="margin-top:0px; margin-left:12px; width:220px; font-size:12pt; text-align:left;">{{{dialogue|{{{2}}}}}}</div>
|}<noinclude>
{{documentation}}[[Category:Templates]][[Category:Diabox templates]]
</noinclude>

User:Pseudosphere

2024-12-03T07:57:58Z

Pseudosphere: foo bar

<skin>Monobook</skin>{{#css:
@import "https://camp2.rectangle.zone/load.php?lang=en&modules=site.styles&only=styles&skin=vector";

a[href], .mw-wiki-logo:active, .toctogglelabel, #p-cactions li a, #p-cactions li.selected a, #p-personal li a {
color: #0094FF;
}
a[href]:hover, .toctogglelabel:hover, #p-cactions li a:hover, #p-cactions li.selected a:hover, #p-personal li a:hover, #p-personal li.active a:hover {
background-color: #666;
}
a[href]:active, .toctogglelabel:active, #p-cactions li a:active, #p-cactions li.selected a:active, #p-personal li a:active, #p-personal li.active a:active {
background-color: #AAA;
}
a.new, #p-cactions .new a, #p-personal a.new {
color: red;
}
a.mw-wiki-logo:hover, a.mw-wiki-logo:active {
background-color: #0000;
}
body {
background-color: #303030;
background-image: none;
font-family: "Nimbus Mono PS", "Courier New", monospace;
font-size: calc(14pt / 1.27);
margin: 5% 15% 0 15%;
position: relative;
}
div.mw-highlight pre {
border-color: #15130F;
}
h1, h2, h3, h4, h5, h6, .mw-editsection-divider, .mw-body, .mw-footer, .pBody, .tocnumber {
color: #CCC;
}
s {
color: #AAAAAA;
}
samp {
font-family: inherit;
white-space: pre;
}
table.wikitable, table.wikitable-nopad {
background: none;
border: none;
border-collapse: separate;
}
td, th, table.wikitable td, table.wikitable th {
border: none;
padding: 0.25em;
text-align: center;
}
td, th.infobox-above, th.infobox-label {
background-color: inherit;
color: #E0E0E0;
}
td.blank {
background-color: #404040;
}
td[title]:hover {
background-color: #888888;
}
th, table.wikitable th, table.wikitable-nopad th {
background-color: #E0E0E0;
color: #303030;
}
th b {
font-weight: normal;
}
div.thumbinner, table.infobox, tr, .infobox tbody tr, .toc {
background-color: #555;
}
tr:nth-child(2n+1) {
background-color: #626262;
}
ul {
list-style-image: none;
}
body.skin--responsive .pBody, body.skin--responsive #p-cactions li.selected a, body.skin--responsive #p-cactions li a, .catlinks, .pBody, .mw-body, .mw-footer, #p-cactions li, #p-cactions li a, #p-cactions li.selected a {
background-color: #303030;
}
.diff tr {
background: none;
}
.diff-addedline .diffchange, .diff-deletedline .diffchange {
color: #000;
}
.infobox th {
background-color: #555 !important;
}
.mw-editsection-bracket {
color: #CCC !important;
}
.mw-parser-output a.external {
color: #0CF;
}
.wikipediauserbox tr {
background-color: initial;
}
#searchform input {
appearance: none;
border: 1px solid #AAA;
}
}}{{#css:
.segs, .segs div {
height: 200px;
width: 200px;
}
.segs div {
animation-delay: 0s !important;
animation-duration: 10s !important;
animation-iteration-count: infinite !important;
animation-timing-function: step-end;
background: red;
position: absolute;
}
@keyframes seg0 {
0%, 50% {
background: red;
}
40% {
background: #F002;
}
}
@keyframes seg1 {
0%, 20%, 50% {
background: red;
}
10%, 40% {
background: #F002;
}
}
@keyframes seg2 {
0%, 40%, 80% {
background: red;
}
10%, 70% {
background: #F002;
}
}
@keyframes seg3 {
0%, 20%, 70% {
background: red;
}
10%, 50% {
background: #F002;
}
}
@keyframes seg4 {
0%, 20%, 60%, 80% {
background: red;
}
10%, 30%, 70%, 90% {
background: #F002;
}
}
@keyframes seg5 {
0%, 30% {
background: red;
}
10% {
background: #F002;
}
}
@keyframes seg6 {
0%, 50%, 80% {
background: red;
}
40%, 70% {
background: #F002;
}
}
@keyframes seg7 {
0%, 80% {
background: red;
}
70% {
background: #F002;
}
}
@keyframes seg8 {
20%, 80% {
background: red;
}
0%, 70% {
background: #F002;
}
}
@keyframes seg9 {
10% {
background: red;
}
0%, 20% {
background: #F002;
}
}
}}
<div class="segs" style="background: #000; padding: 10px;">
<div style="animation-name: seg0; clip-path: polygon(1% 0, 40% 0, 60% 20%, 21% 20%);"></div>
<div style="animation-name: seg1; clip-path: polygon(42% 0, 99% 0, 79% 20%, 62% 20%);"></div>
<div style="animation-name: seg2; clip-path: polygon(0 1%, 20% 21%, 20% 39%, 10% 49%, 0 39%);"></div>
<div style="animation-name: seg3; clip-path: polygon(100% 1%, 80% 21%, 80% 39%, 90% 49%, 100% 39%);"></div>
<div style="animation-name: seg4; clip-path: polygon(0 99%, 20% 79%, 20% 61%, 10% 51%, 0 61%);"></div>
<div style="animation-name: seg5; clip-path: polygon(100% 99%, 80% 79%, 80% 61%, 90% 51%, 100% 61%);"></div>
<div style="animation-name: seg6; clip-path: polygon(99% 100%, 1% 100%, 21% 80%, 79% 80%);"></div>
<div style="animation-name: seg7; clip-path: polygon(40% 40%, 60% 40%, 60% 60%, 40% 60%);"></div>
<div style="animation-name: seg8; clip-path: polygon(11% 50%, 21% 40%, 38% 40%, 38% 60%, 21% 60%);"></div>
<div style="animation-name: seg8; clip-path: polygon(89% 50%, 79% 40%, 62% 40%, 62% 60%, 79% 60%);"></div>
<div style="animation-name: seg9; clip-path: polygon(40% 22%, 60% 22%, 60% 38%, 40% 38%);"></div>
<div style="animation-name: seg9; clip-path: polygon(40% 78%, 60% 78%, 60% 62%, 40% 62%);"></div>
</div>

<span class="divine">Insecure CSS sanitization??</span>

User:Pseudosphere

2024-12-03T07:48:39Z

Pseudosphere: foo bar

User:Pseudosphere

2024-12-03T07:40:58Z

Pseudosphere: bar

User:Pseudosphere

2024-12-03T01:06:13Z

Pseudosphere: foo bar

User:Pseudosphere

2024-12-02T09:35:20Z

Pseudosphere: asdfghjkl

<skin>Monobook</skin>{{#css:
a[href], .mw-wiki-logo:active, .toctogglelabel, #p-cactions li a, #p-cactions li.selected a, #p-personal li a {
color: #0094FF;
}
a[href]:hover, .toctogglelabel:hover, #p-cactions li a:hover, #p-cactions li.selected a:hover, #p-personal li a:hover, #p-personal li.active a:hover {
background-color: #666;
}
a[href]:active, .toctogglelabel:active, #p-cactions li a:active, #p-cactions li.selected a:active, #p-personal li a:active, #p-personal li.active a:active {
background-color: #AAA;
}
a.new, #p-cactions .new a, #p-personal a.new {
color: red;
}
a.mw-wiki-logo:hover, a.mw-wiki-logo:active {
background-color: #0000;
}
body {
background-color: #303030;
background-image: none;
font-family: "Nimbus Mono PS", "Courier New", monospace;
font-size: calc(14pt / 1.27);
margin: 5% 15% 0 15%;
position: relative;
}
div.mw-highlight pre {
border-color: #15130F;
}
h1, h2, h3, h4, h5, h6, .mw-editsection-divider, .mw-body, .mw-footer, .pBody, .tocnumber {
color: #CCC;
}
s {
color: #AAAAAA;
}
samp {
font-family: inherit;
white-space: pre;
}
table.wikitable, table.wikitable-nopad {
background: none;
border: none;
border-collapse: separate;
}
td, th, table.wikitable td, table.wikitable th {
border: none;
padding: 0.25em;
text-align: center;
}
td, th.infobox-above, th.infobox-label {
background-color: inherit;
color: #E0E0E0;
}
td.blank {
background-color: #404040;
}
td[title]:hover {
background-color: #888888;
}
th, table.wikitable th, table.wikitable-nopad th {
background-color: #E0E0E0;
color: #303030;
}
th b {
font-weight: normal;
}
div.thumbinner, table.infobox, tr, .infobox tbody tr, .toc {
background-color: #555;
}
tr:nth-child(2n+1) {
background-color: #626262;
}
ul {
list-style-image: none;
}
body.skin--responsive .pBody, body.skin--responsive #p-cactions li.selected a, body.skin--responsive #p-cactions li a, .catlinks, .pBody, .mw-body, .mw-footer, #p-cactions li, #p-cactions li a, #p-cactions li.selected a {
background-color: #303030;
}
.diff tr {
background: none;
}
.diff-addedline .diffchange, .diff-deletedline .diffchange {
color: #000;
}
.infobox th {
background-color: #555 !important;
}
.mw-editsection-bracket {
color: #CCC !important;
}
.mw-parser-output a.external {
color: #0CF;
}
.wikipediauserbox tr {
background-color: initial;
}
#searchform input {
appearance: none;
border: 1px solid #AAA;
}
}}{{#css:
.segs, .segs div {
height: 200px;
width: 200px;
}
.segs div {
animation-delay: 0s !important;
animation-duration: 10s !important;
animation-iteration-count: infinite !important;
animation-timing-function: step-end;
background: red;
position: absolute;
}
@keyframes seg0 {
0%, 50% {
background: red;
}
40% {
background: #F002;
}
}
@keyframes seg1 {
0%, 20%, 50% {
background: red;
}
10%, 40% {
background: #F002;
}
}
@keyframes seg2 {
0%, 40%, 80% {
background: red;
}
10%, 70% {
background: #F002;
}
}
@keyframes seg3 {
0%, 20%, 70% {
background: red;
}
10%, 50% {
background: #F002;
}
}
@keyframes seg4 {
0%, 20%, 60%, 80% {
background: red;
}
10%, 30%, 70%, 90% {
background: #F002;
}
}
@keyframes seg5 {
0%, 30% {
background: red;
}
10% {
background: #F002;
}
}
@keyframes seg6 {
0%, 50%, 80% {
background: red;
}
40%, 70% {
background: #F002;
}
}
@keyframes seg7 {
0%, 80% {
background: red;
}
70% {
background: #F002;
}
}
@keyframes seg8 {
20%, 80% {
background: red;
}
0%, 70% {
background: #F002;
}
}
@keyframes seg9 {
10% {
background: red;
}
0%, 20% {
background: #F002;
}
}
}}
<div class="segs" style="background: #000; padding: 10px;">
<div style="animation-name: seg0; clip-path: polygon(1% 0, 40% 0, 60% 20%, 21% 20%);"></div>
<div style="animation-name: seg1; clip-path: polygon(42% 0, 99% 0, 79% 20%, 62% 20%);"></div>
<div style="animation-name: seg2; clip-path: polygon(0 1%, 20% 21%, 20% 39%, 10% 49%, 0 39%);"></div>
<div style="animation-name: seg3; clip-path: polygon(100% 1%, 80% 21%, 80% 39%, 90% 49%, 100% 39%);"></div>
<div style="animation-name: seg4; clip-path: polygon(0 99%, 20% 79%, 20% 61%, 10% 51%, 0 61%);"></div>
<div style="animation-name: seg5; clip-path: polygon(100% 99%, 80% 79%, 80% 61%, 90% 51%, 100% 61%);"></div>
<div style="animation-name: seg6; clip-path: polygon(99% 100%, 1% 100%, 21% 80%, 79% 80%);"></div>
<div style="animation-name: seg7; clip-path: polygon(40% 40%, 60% 40%, 60% 60%, 40% 60%);"></div>
<div style="animation-name: seg8; clip-path: polygon(11% 50%, 21% 40%, 38% 40%, 38% 60%, 21% 60%);"></div>
<div style="animation-name: seg8; clip-path: polygon(89% 50%, 79% 40%, 62% 40%, 62% 60%, 79% 60%);"></div>
<div style="animation-name: seg9; clip-path: polygon(40% 22%, 60% 22%, 60% 38%, 40% 38%);"></div>
<div style="animation-name: seg9; clip-path: polygon(40% 78%, 60% 78%, 60% 62%, 40% 62%);"></div>
</div>

User:Pseudosphere

2024-12-02T09:33:22Z

Pseudosphere:

DVD in a triangle

2024-10-27T00:00:26Z

Pseudosphere:

{{#css:
.dvd img {
animation: linear dvd;
animation-direction: alternate;
animation-duration: 32s !important;
animation-delay: 0s !important;
animation-iteration-count: infinite !important;
position: relative;
}
@keyframes dvd {
0%, 100% {left: 0; top: 0;}
9.090906854033472% {left: 154.26353098545454px; top: 190.85162387216477px;}
16.666662565722355% {left: 80.80470670666666px; top: 0;}
25.00001560719906% {left: 0; top: 209.93741561928337px;}
27.272720562242192% {left: 22.037647286280883px; top: 267.19227342393964px;}
28.57142097308754% {left: 0; top: 239.92777545557723px;}
39.999990158034535% {left: 193.931296096px; top: 0;}
45.454534270520746% {left: 286.48941468771346px; top: 114.51097432523818px;}
49.99998769760699% {left: 242.41412012px; top: 0;}
57.142863206043494% {left: 173.15301220403433px; top: 179.94642550627722px;}
63.63637414384864% {left: 0; top: 152.6812990987015px;}
75.00000771141325% {left: 303.01765015px; top: 104.96839312993303px;}
80.00000648113863% {left: 387.862592192px; top: 0;}
81.81818785202829% {left: 418.7152983908539px; top: 38.170324775887444px;}
83.33333899443981% {left: 404.02353353333336px; top: 0;}
85.71429406053099% {left: 380.93633595193137px; top: 59.98198022601232px;}
}
}}
<div class="dvd" style="background: #000; clip-path: polygon(0 0, 100% 0, 0 100%); height: 415.6921938165305px; width: 720px;">[[File:Dvd logo.png|128x76px|link=]]</div>
[[Category:Pages that don't even remotely resemble a Wikipedia article]]

DVD in a triangle

2024-10-26T23:57:35Z

Pseudosphere: Created page with "{{#css: .dvd img { animation: linear dvd; animation-direction: alternate; animation-duration: 16s !important; animation-delay: 0s !important; animation-iteration-count: infinite !important; position: relative; } @keyframes dvd { 0%, 100% {left: 0; top: 0;} 9.090906854033472% {left: 154.26353098545454px; top: 190.85162387216477px;} 16.666662565722355% {left: 80.80470670666666px; top: 0;} 25.00001560719906% {left: 0; top: 209.93741561928337px;} 27.272720562242192% {left: 2..."

{{#css:
.dvd img {
animation: linear dvd;
animation-direction: alternate;
animation-duration: 16s !important;
animation-delay: 0s !important;
animation-iteration-count: infinite !important;
position: relative;
}
@keyframes dvd {
0%, 100% {left: 0; top: 0;}
9.090906854033472% {left: 154.26353098545454px; top: 190.85162387216477px;}
16.666662565722355% {left: 80.80470670666666px; top: 0;}
25.00001560719906% {left: 0; top: 209.93741561928337px;}
27.272720562242192% {left: 22.037647286280883px; top: 267.19227342393964px;}
28.57142097308754% {left: 0; top: 239.92777545557723px;}
39.999990158034535% {left: 193.931296096px; top: 0;}
45.454534270520746% {left: 286.48941468771346px; top: 114.51097432523818px;}
49.99998769760699% {left: 242.41412012px; top: 0;}
57.142863206043494% {left: 173.15301220403433px; top: 179.94642550627722px;}
63.63637414384864% {left: 0; top: 152.6812990987015px;}
75.00000771141325% {left: 303.01765015px; top: 104.96839312993303px;}
80.00000648113863% {left: 387.862592192px; top: 0;}
81.81818785202829% {left: 418.7152983908539px; top: 38.170324775887444px;}
83.33333899443981% {left: 404.02353353333336px; top: 0;}
85.71429406053099% {left: 380.93633595193137px; top: 59.98198022601232px;}
}
}}
<div class="dvd" style="background: #000; clip-path: polygon(0 0, 100% 0, 0 100%); height: 415.6921938165305px; width: 720px;">[[File:Dvd logo.png|128x76px|link=]]</div>
[[Category:Pages that don't even remotely resemble a Wikipedia article]]

Template:Credits.css

2024-10-26T23:53:03Z

Pseudosphere:

.mw-body {
background-color: navy;
font-family:"Bubblegum Sans";
}
.firstHeading {
text-align: center;
}
.box {
height: 256px;
overflow: hidden;
position: relative;
}
.box .content {
color:#b39d26;
text-shadow:0.05em 0.05em 0.02em #000000;
font-size: 5vw;
position: absolute;
width: 100%;
height: 100vh;
margin: 0;
animation: scroll linear;
animation-delay: 0s !important;
animation-duration: 130s !important;
animation-iteration-count: infinite !important;
}
.box .content a, .box .content .nowrap span {
color:#b39d26 !important;
}
.box .content .smaller {
font-size: 3.5vw;
}
@keyframes scroll {
0% {transform: translateY(50%);}
100% {transform: translateY(-900%);}
}

Cube Jr.

2024-10-26T23:51:33Z

Pseudosphere:

{{Distinguish|JR Cuber}}

{{#css:
.scene {
width: 50px;
height: 50px;
perspective: 600px;
margin: 10px;
}

.cube {
width: 100%;
height: 100%;
position: relative;
transform-style: preserve-3d;
animation: rotatey linear;
animation-delay: 0s !important;
animation-duration: 5s !important;
animation-iteration-count: infinite !important;
}

.cube-face {
position: absolute;
width: 50px;
height: 50px;
}
.face-front { transform: rotateY( 0deg) translateZ(25px); background-color: rgba(255, 0, 0, 0.5); }
.face-right { transform: rotateY( 90deg) translateZ(25px); background-color: rgba(255, 255, 0, 0.5); }
.face-back { transform: rotateY(180deg) translateZ(25px); background-color: rgba(0, 255, 0, 0.5); }
.face-left { transform: rotateY(-90deg) translateZ(25px); background-color: rgba(0, 255, 255, 0.5); }
.face-top { transform: rotateX( 90deg) translateZ(25px); background-color: rgba(0, 0, 255, 0.5); }
.face-bottom { transform: rotateX(-90deg) translateZ(25px); background-color: rgba(255, 0, 255, 0.5); }
@keyframes rotatey {
0% { transform: rotate3d(0, 0, 1, 0deg); }
100% { transform: rotate3d(1, 0, 1, 360deg); }
}
/* most of the css was taken from https://3dtransforms.desandro.com/cube */
}}
<div class="scene">
<div class="cube">
<div class="cube-face face-front"></div>
<div class="cube-face face-back"></div>
<div class="cube-face face-right"></div>
<div class="cube-face face-left"></div>
<div class="cube-face face-top"></div>
<div class="cube-face face-bottom"></div>
</div>
</div>
[[Category:Parlor tricks]]
[[Category:Pages containing a rotating css cube jr.]]
[[Category:Pages that don't even remotely resemble a Wikipedia article]]
[[Category:Shapes]]
[[Category:Juniors]]

File:Dvd logo.png

2024-10-26T23:20:12Z

Pseudosphere:

User:Pseudosphere

2024-09-20T03:32:05Z

Pseudosphere:

Template:NumberFormatPad

2024-09-11T01:09:08Z

Pseudosphere:

<onlyinclude>{{#vardefine:_nmfmpd|{{#number_format:{{{1}}}|_|.||{{{5|}}}}}}}{{#ifexpr:{{#var:_nmfmpd}}<0|-{{#vardefine:_nmfmpd|{{#expr:abs{{#var:_nmfmpd}}}}}}|{{#if:{{{sgn|}}}|+}}}}{{#vardefine:_nmfmpd_numlen|{{#invoke:String|len|{{#expr:{{#var:_nmfmpd}}round0}}}}}}{{#ifexpr:{{{pad|0}}}>{{#var:_nmfmpd_numlen}}|{{#loop:_nmfmpd_i|{{{pad}}}|{{#expr:{{#var:_nmfmpd_numlen}}-{{{pad}}}}}|0{{#ifexpr:{{#var:_nmfmpd_i}}mod3=1|{{#switch:{{{4}}}|n= |t= |{{{4|,}}}}}}}}}}}{{#number_format:{{#var:_nmfmpd}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}}}</onlyinclude>
* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|123456|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}
* {{NumberFormatPad|+1234|pad=7}}
* {{NumberFormatPad|-1234|pad=7}}
* {{NumberFormatPad|+1234|pad=7|sgn=Y}}
* {{NumberFormatPad|-1234|pad=7|sgn=Y}}

Template:NumberFormatPad

2024-09-10T23:03:35Z

Pseudosphere: namespacing

<onlyinclude>{{#vardefine:_nmfmpd_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#ifexpr:{{{pad|0}}}>{{#var:_nmfmpd_numlen}}|{{#loop:_nmfmpd_i|{{{pad}}}|{{#expr:{{#var:_nmfmpd_numlen}}-{{{pad}}}}}|0{{#ifexpr:{{#var:_nmfmpd_i}}mod3=1|{{#switch:{{{4}}}|n= |t= |{{{4|,}}}}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude>

* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|123456|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}

Template:NumberFormatPad

2024-09-10T22:28:52Z

Pseudosphere:

<onlyinclude>{{#vardefine:_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#ifexpr:{{{pad|0}}}>{{#var:_numlen}}|{{#loop:_i|{{{pad}}}|{{#expr:{{#var:_numlen}}-{{{pad}}}}}|0{{#ifexpr:{{#var:_i}}mod3=1|{{#switch:{{{4}}}|n= |t= |{{{4|,}}}}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude>

* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|123456|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}

Template:NumberFormatPad

2024-09-10T22:08:01Z

Pseudosphere:

<onlyinclude>{{#if:{{{pad|}}}|{{#vardefine:_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#loop:_i|{{{pad}}}|{{#expr:{{#var:_numlen}}-{{{pad}}}}}|0{{#ifexpr:{{#var:_i}}mod3=1|{{#switch:{{{4}}}|n= |t= |{{{4|,}}}}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude>

* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}

Template:NumberFormatPad

2024-09-10T22:04:41Z

Pseudosphere:

<onlyinclude>{{#if:{{{pad|}}}|{{#vardefine:_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#loop:_i|{{{pad}}}|{{#expr:{{#var:_numlen}}-{{{pad}}}}}|0{{#ifexpr:{{#var:_i}}mod3=1|{{#ifeq:{{{4}}}|n| |{{#ifeq:{{{4}}}|t| |{{{4|,}}}}}}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude>

* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}

Template:NumberFormatPad

2024-09-10T22:04:02Z

Pseudosphere:

<onlyinclude>{{#if:{{{pad|}}}|{{#vardefine:_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#loop:_i|{{{pad}}}|{{#expr:{{#var:_numlen}}-{{{pad}}}}}|0{{#ifexpr:{{#var:_i}}mod3=1|{{#ifeq:{{{4}}}|n| |{{#ifeq:{{{4}}}|t| |{{{4|,}}}}}}}}}{{#vardefine:_i|{{#expr:{{#var:_i}}-1}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude>

* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}

Template:NumberFormatPad

2024-09-10T02:27:41Z

Pseudosphere: Created page with "<onlyinclude>{{#if:{{{pad|}}}|{{#vardefine:_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#vardefine:_i|{{{pad}}}}}{{#while:|{{#ifexpr:{{#var:_i}}>{{#var:_numlen}}|T}}|0{{#ifexpr:{{#var:_i}}mod3=1|{{#ifeq:{{{4}}}|n| |{{#ifeq:{{{4}}}|t| |{{{4|,}}}}}}}}}{{#vardefine:_i|{{#expr:{{#var:_i}}-1}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude> * {{NumberFormatPad|0|pad=1}} * {{NumberFormatPad|1|pad=1}..."

<onlyinclude>{{#if:{{{pad|}}}|{{#vardefine:_numlen|{{#invoke:String|len|{{#number_format:{{{1}}}|0|||{{{5|}}}}}}}}}{{#vardefine:_i|{{{pad}}}}}{{#while:|{{#ifexpr:{{#var:_i}}>{{#var:_numlen}}|T}}|0{{#ifexpr:{{#var:_i}}mod3=1|{{#ifeq:{{{4}}}|n| |{{#ifeq:{{{4}}}|t| |{{{4|,}}}}}}}}}{{#vardefine:_i|{{#expr:{{#var:_i}}-1}}}}}}}}{{#number_format:{{{1}}}|{{{2|0}}}|{{{3|.}}}|{{{4|,}}}|{{{5|}}}}}</onlyinclude>

* {{NumberFormatPad|0|pad=1}}
* {{NumberFormatPad|1|pad=1}}
* {{NumberFormatPad|0|pad=2}}
* {{NumberFormatPad|1|pad=2}}
* {{NumberFormatPad|12|pad=2}}
* {{NumberFormatPad|0|pad=3}}
* {{NumberFormatPad|1|pad=3}}
* {{NumberFormatPad|12|pad=3}}
* {{NumberFormatPad|123|pad=3}}
* {{NumberFormatPad|0|pad=4}}
* {{NumberFormatPad|1|pad=4}}
* {{NumberFormatPad|12|pad=4}}
* {{NumberFormatPad|123|pad=4}}
* {{NumberFormatPad|1234|pad=4}}
* {{NumberFormatPad|0|pad=5}}
* {{NumberFormatPad|1|pad=5}}
* {{NumberFormatPad|12|pad=5}}
* {{NumberFormatPad|123|pad=5}}
* {{NumberFormatPad|1234|pad=5}}
* {{NumberFormatPad|12345|pad=5}}
* {{NumberFormatPad|0|pad=6}}
* {{NumberFormatPad|1|pad=6}}
* {{NumberFormatPad|12|pad=6}}
* {{NumberFormatPad|123|pad=6}}
* {{NumberFormatPad|1234|pad=6}}
* {{NumberFormatPad|12345|pad=6}}
* {{NumberFormatPad|123456.789123456|7|,|.|pad=6}}
* {{NumberFormatPad|98:789123456|10|,|.|:|pad=7}}
* {{NumberFormatPad|1|pad=7}}
* {{NumberFormatPad|12|pad=7}}
* {{NumberFormatPad|123|pad=7}}
* {{NumberFormatPad|1234|pad=7}}
* {{NumberFormatPad|12345.6789|2|.|n|pad=7}}
* {{NumberFormatPad|123456.789|2|.|t|pad=7}}
* {{NumberFormatPad|1234567|pad=7}}

User:Pseudosphere

2024-05-01T07:46:47Z

Pseudosphere: Created page with "<skin>Monobook</skin>{{#css: a[href], .mw-wiki-logo:active, .toctogglelabel, #p-cactions li a, #p-cactions li.selected a, #p-personal li a { color: #0094FF; } a[href]:hover, .toctogglelabel:hover, #p-cactions li a:hover, #p-cactions li.selected a:hover, #p-personal li a:hover, #p-personal li.active a:hover { background-color: #666; } a[href]:active, .toctogglelabel:active, #p-cactions li a:active, #p-cactions li.selected a:active, #p-personal li a:active, #p-personal li...."

Nim Jr.

2024-05-01T07:15:52Z

Pseudosphere: Created page with "{{JuniorPage}}{{#css:.bs{text-align:center}.b,.nb{background-color:#DDD;border:4pt outset#EEE;display:inline-block;user-select:none}.b:hover{text-decoration:underline}.b:active{background-color:#CCC;border-style:inset}.nb{color:#777;text-decoration:line-through}*:not(.mw-collapsed)~.nb{display:none;}.g img{transform:scale(0.5)} }}On your turn jr., you must remove one, two, or three from play jr.. Once you end your turn jr., your opponent jr. will do the same. Whoever rem..."

{{JuniorPage}}{{#css:.bs{text-align:center}.b,.nb{background-color:#DDD;border:4pt outset#EEE;display:inline-block;user-select:none}.b:hover{text-decoration:underline}.b:active{background-color:#CCC;border-style:inset}.nb{color:#777;text-decoration:line-through}*:not(.mw-collapsed)~.nb{display:none;}.g img{transform:scale(0.5)}
}}On your turn jr., you must remove one, two, or three from play jr..
Once you end your turn jr., your opponent jr. will do the same.
Whoever removes all from play wins jr..<p class="g"><span class="mw-collapsible" id="mw-customcollapsible-b0">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-1">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-2">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-3">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b1">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-5">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-6">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-7">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b2">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-9">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-10">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-11">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b3">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-13">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-14">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-15">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b4">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-17">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-18">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-19">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b5">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-21">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-22">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-23">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b6">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-25">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-26">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-27">[[File:TWC2 logo.png|link=]]</span></span><span class="mw-collapsible" id="mw-customcollapsible-b7">[[File:TWC2 logo.png|link=]]<span class="mw-collapsible" id="mw-customcollapsible-29">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-30">[[File:TWC2 logo.png|link=]]</span><span class="mw-collapsible" id="mw-customcollapsible-31">[[File:TWC2 logo.png|link=]]</span></span></p><p class="bs"><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t0"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n1 mw-customtoggle-1" id="mw-customcollapsible-n1">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n1 mw-customtoggle-n2 mw-customtoggle-2" id="mw-customcollapsible-n2">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n2 mw-customtoggle-n3 mw-customtoggle-3 mw-customtoggle-e0" id="mw-customcollapsible-n3">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t1"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n5 mw-customtoggle-5" id="mw-customcollapsible-n5">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n5 mw-customtoggle-n6 mw-customtoggle-6" id="mw-customcollapsible-n6">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n6 mw-customtoggle-n7 mw-customtoggle-7 mw-customtoggle-e1" id="mw-customcollapsible-n7">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t2"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n9 mw-customtoggle-9" id="mw-customcollapsible-n9">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n9 mw-customtoggle-n10 mw-customtoggle-10" id="mw-customcollapsible-n10">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n10 mw-customtoggle-n11 mw-customtoggle-11 mw-customtoggle-e2" id="mw-customcollapsible-n11">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t3"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n13 mw-customtoggle-13" id="mw-customcollapsible-n13">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n13 mw-customtoggle-n14 mw-customtoggle-14" id="mw-customcollapsible-n14">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n14 mw-customtoggle-n15 mw-customtoggle-15 mw-customtoggle-e3" id="mw-customcollapsible-n15">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t4"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n17 mw-customtoggle-17" id="mw-customcollapsible-n17">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n17 mw-customtoggle-n18 mw-customtoggle-18" id="mw-customcollapsible-n18">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n18 mw-customtoggle-n19 mw-customtoggle-19 mw-customtoggle-e4" id="mw-customcollapsible-n19">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t5"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n21 mw-customtoggle-21" id="mw-customcollapsible-n21">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n21 mw-customtoggle-n22 mw-customtoggle-22" id="mw-customcollapsible-n22">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n22 mw-customtoggle-n23 mw-customtoggle-23 mw-customtoggle-e5" id="mw-customcollapsible-n23">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible mw-collapsed" id="mw-customcollapsible-t6"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n25 mw-customtoggle-25" id="mw-customcollapsible-n25">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n25 mw-customtoggle-n26 mw-customtoggle-26" id="mw-customcollapsible-n26">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n26 mw-customtoggle-n27 mw-customtoggle-27 mw-customtoggle-e6" id="mw-customcollapsible-n27">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="mw-collapsible" id="mw-customcollapsible-t7"><span class="mw-collapsible mw-collapsed b mw-customtoggle-n29 mw-customtoggle-29" id="mw-customcollapsible-n29">Remove one jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-n29 mw-customtoggle-n30 mw-customtoggle-30" id="mw-customcollapsible-n30">Remove one jr.</span><span class="mw-collapsible b mw-customtoggle-n30 mw-customtoggle-n31 mw-customtoggle-31 mw-customtoggle-e7" id="mw-customcollapsible-n31">Remove one jr.</span><span class="nb">Remove one jr.</span></span><span class="nb">Remove one jr.</span></p><p class="bs"><span class="mw-collapsible mw-collapsed b mw-customtoggle-e0 mw-customtoggle-l mw-customtoggle-t0 mw-customtoggle-b0" id="mw-customcollapsible-e0">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e1 mw-customtoggle-t0 mw-customtoggle-t1 mw-customtoggle-b1" id="mw-customcollapsible-e1">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e2 mw-customtoggle-t1 mw-customtoggle-t2 mw-customtoggle-b2" id="mw-customcollapsible-e2">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e3 mw-customtoggle-t2 mw-customtoggle-t3 mw-customtoggle-b3" id="mw-customcollapsible-e3">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e4 mw-customtoggle-t3 mw-customtoggle-t4 mw-customtoggle-b4" id="mw-customcollapsible-e4">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e5 mw-customtoggle-t4 mw-customtoggle-t5 mw-customtoggle-b5" id="mw-customcollapsible-e5">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e6 mw-customtoggle-t5 mw-customtoggle-t6 mw-customtoggle-b6" id="mw-customcollapsible-e6">End turn jr.</span><span class="mw-collapsible mw-collapsed b mw-customtoggle-e7 mw-customtoggle-t6 mw-customtoggle-t7 mw-customtoggle-b7" id="mw-customcollapsible-e7">End turn jr.</span><span class="nb">End turn jr.</span></p><center class="mw-collapsible mw-collapsed" id="mw-customcollapsible-l">you lose jr.</center>[[Category:Juniors]]

Rotating CSS Tesseract Jr.

2024-05-01T07:12:04Z

Pseudosphere: Undo revision 646 by Pseudosphere (talk)

{{JuniorPage}}{{#css:.scene{height:200px;margin:100px;perspective:600px;transform:scale(0.5);width:200px}.tc{height:100%;position:absolute;transform-style:preserve-3d;width:100%}.rf,.rr,.rb,.rl,.rt,.rm{height:200px;position:absolute;width:200px}.t{animation:8s linear infinite rotateyly !important;height:100%;position:relative;transform-style:preserve-3d;width:100%}.rf{transform:rotateY(0deg)translateZ(100px)}.rr{transform:rotateY(90deg)translateZ(100px)}.rb{transform:rotateY(180deg)translateZ(100px)}.rl{transform:rotateY(-90deg)translateZ(100px)}.rt{transform:rotateX(90deg)translateZ(100px)}.rm{transform:rotateX(-90deg)translateZ(100px)}@keyframes rotateyly{0%{transform:rotate3d(-1,1,0,45deg)rotateX(0turn)}100%{transform:rotate3d(-1,1,0,45deg)rotateX(1turn)}
}@keyframes cf{100%,0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1)}4.167%{transform:matrix3d(0.965926,0,0,0.001294,0,1,0,0,0,0,1,0,25.8819,0,0,1.017037)}8.333%{transform:matrix3d(0.866025,0,0,0.0025,0,1,0,0,0,0,1,0,50,0,0,1.066987)}12.5%{transform:matrix3d(0.707107,0,0,0.003536,0,1,0,0,0,0,1,0,70.71068,0,0,1.146447)}16.667%{transform:matrix3d(0.5,0,0,0.00433,0,1,0,0,0,0,1,0,86.60254,0,0,1.25)}20.833%{transform:matrix3d(0.258819,0,0,0.00483,0,1,0,0,0,0,1,0,96.59258,0,0,1.37059)}25%{transform:matrix3d(0,0,0,0.005,0,1,0,0,0,0,1,0,100,0,0,1.5)}29.167%{transform:matrix3d(-0.258819,0,0,0.00483,0,1,0,0,0,0,1,0,96.59258,0,0,1.62941)}33.333%{transform:matrix3d(-0.5,0,0,0.00433,0,1,0,0,0,0,1,0,86.60254,0,0,1.75)}37.5%{transform:matrix3d(-0.707107,0,0,0.003536,0,1,0,0,0,0,1,0,70.71068,0,0,1.853553)}41.667%{transform:matrix3d(-0.866025,0,0,0.0025,0,1,0,0,0,0,1,0,50,0,0,1.933013)}45.833%{transform:matrix3d(-0.965926,0,0,0.001294,0,1,0,0,0,0,1,0,25.8819,0,0,1.982963)}50%{transform:matrix3d(-1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,2)}54.167%{transform:matrix3d(-0.965926,0,0,-0.001294,0,1,0,0,0,0,1,0,-25.8819,0,0,1.982963)}58.333%{transform:matrix3d(-0.866025,0,0,-0.0025,0,1,0,0,0,0,1,0,-50,0,0,1.933013)}62.5%{transform:matrix3d(-0.707107,0,0,-0.003536,0,1,0,0,0,0,1,0,-70.71068,0,0,1.853553)}66.667%{transform:matrix3d(-0.5,0,0,-0.00433,0,1,0,0,0,0,1,0,-86.60254,0,0,1.75)}70.833%{transform:matrix3d(-0.258819,0,0,-0.00483,0,1,0,0,0,0,1,0,-96.59258,0,0,1.62941)}75%{transform:matrix3d(0,0,0,-0.005,0,1,0,0,0,0,1,0,-100,0,0,1.5)}79.167%{transform:matrix3d(0.258819,0,0,-0.00483,0,1,0,0,0,0,1,0,-96.59258,0,0,1.37059)}83.333%{transform:matrix3d(0.5,0,0,-0.00433,0,1,0,0,0,0,1,0,-86.60254,0,0,1.25)}87.5%{transform:matrix3d(0.707107,0,0,-0.003536,0,1,0,0,0,0,1,0,-70.71068,0,0,1.146447)}91.667%{transform:matrix3d(0.866025,0,0,-0.0025,0,1,0,0,0,0,1,0,-50,0,0,1.066987)}95.833%{transform:matrix3d(0.965926,0,0,-0.001294,0,1,0,0,0,0,1,0,-25.8819,0,0,1.017037)}
}@keyframes cr{100%,0%{transform:matrix3d(0,0,0,0.005,0,0,-1,0,0,1,0,0,100,0,0,1.5)}4.167%{transform:matrix3d(-0.258819,0,0,0.00483,0,0,-1,0,0,1,0,0,96.59258,0,0,1.62941)}8.333%{transform:matrix3d(-0.5,0,0,0.00433,0,0,-1,0,0,1,0,0,86.60254,0,0,1.75)}12.5%{transform:matrix3d(-0.707107,0,0,0.003536,0,0,-1,0,0,1,0,0,70.71068,0,0,1.853553)}16.667%{transform:matrix3d(-0.866025,0,0,0.0025,0,0,-1,0,0,1,0,0,50,0,0,1.933013)}20.833%{transform:matrix3d(-0.965926,0,0,0.001294,0,0,-1,0,0,1,0,0,25.8819,0,0,1.982963)}25%{transform:matrix3d(-1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,2)}29.167%{transform:matrix3d(-0.965926,0,0,-0.001294,0,0,-1,0,0,1,0,0,-25.8819,0,0,1.982963)}33.333%{transform:matrix3d(-0.866025,0,0,-0.0025,0,0,-1,0,0,1,0,0,-50,0,0,1.933013)}37.5%{transform:matrix3d(-0.707107,0,0,-0.003536,0,0,-1,0,0,1,0,0,-70.71068,0,0,1.853553)}41.667%{transform:matrix3d(-0.5,0,0,-0.00433,0,0,-1,0,0,1,0,0,-86.60254,0,0,1.75)}45.833%{transform:matrix3d(-0.258819,0,0,-0.00483,0,0,-1,0,0,1,0,0,-96.59258,0,0,1.62941)}50%{transform:matrix3d(0,0,0,-0.005,0,0,-1,0,0,1,0,0,-100,0,0,1.5)}54.167%{transform:matrix3d(0.258819,0,0,-0.00483,0,0,-1,0,0,1,0,0,-96.59258,0,0,1.37059)}58.333%{transform:matrix3d(0.5,0,0,-0.00433,0,0,-1,0,0,1,0,0,-86.60254,0,0,1.25)}62.5%{transform:matrix3d(0.707107,0,0,-0.003536,0,0,-1,0,0,1,0,0,-70.71068,0,0,1.146447)}66.667%{transform:matrix3d(0.866025,0,0,-0.0025,0,0,-1,0,0,1,0,0,-50,0,0,1.066987)}70.833%{transform:matrix3d(0.965926,0,0,-0.001294,0,0,-1,0,0,1,0,0,-25.8819,0,0,1.017037)}75%{transform:matrix3d(1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,1)}79.167%{transform:matrix3d(0.965926,0,0,0.001294,0,0,-1,0,0,1,0,0,25.8819,0,0,1.017037)}83.333%{transform:matrix3d(0.866025,0,0,0.0025,0,0,-1,0,0,1,0,0,50,0,0,1.066987)}87.5%{transform:matrix3d(0.707107,0,0,0.003536,0,0,-1,0,0,1,0,0,70.71068,0,0,1.146447)}91.667%{transform:matrix3d(0.5,0,0,0.00433,0,0,-1,0,0,1,0,0,86.60254,0,0,1.25)}95.833%{transform:matrix3d(0.258819,0,0,0.00483,0,0,-1,0,0,1,0,0,96.59258,0,0,1.37059)}
}@keyframes cb{100%,0%{transform:matrix3d(-1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,2)}4.167%{transform:matrix3d(-0.965926,0,0,-0.001294,0,-1,0,0,0,0,-1,0,-25.8819,0,0,1.982963)}8.333%{transform:matrix3d(-0.866025,0,0,-0.0025,0,-1,0,0,0,0,-1,0,-50,0,0,1.933013)}12.5%{transform:matrix3d(-0.707107,0,0,-0.003536,0,-1,0,0,0,0,-1,0,-70.71068,0,0,1.853553)}16.667%{transform:matrix3d(-0.5,0,0,-0.00433,0,-1,0,0,0,0,-1,0,-86.60254,0,0,1.75)}20.833%{transform:matrix3d(-0.258819,0,0,-0.00483,0,-1,0,0,0,0,-1,0,-96.59258,0,0,1.62941)}25%{transform:matrix3d(0,0,0,-0.005,0,-1,0,0,0,0,-1,0,-100,0,0,1.5)}29.167%{transform:matrix3d(0.258819,0,0,-0.00483,0,-1,0,0,0,0,-1,0,-96.59258,0,0,1.37059)}33.333%{transform:matrix3d(0.5,0,0,-0.00433,0,-1,0,0,0,0,-1,0,-86.60254,0,0,1.25)}37.5%{transform:matrix3d(0.707107,0,0,-0.003536,0,-1,0,0,0,0,-1,0,-70.71068,0,0,1.146447)}41.667%{transform:matrix3d(0.866025,0,0,-0.0025,0,-1,0,0,0,0,-1,0,-50,0,0,1.066987)}45.833%{transform:matrix3d(0.965926,0,0,-0.001294,0,-1,0,0,0,0,-1,0,-25.8819,0,0,1.017037)}50%{transform:matrix3d(1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,1)}54.167%{transform:matrix3d(0.965926,0,0,0.001294,0,-1,0,0,0,0,-1,0,25.8819,0,0,1.017037)}58.333%{transform:matrix3d(0.866025,0,0,0.0025,0,-1,0,0,0,0,-1,0,50,0,0,1.066987)}62.5%{transform:matrix3d(0.707107,0,0,0.003536,0,-1,0,0,0,0,-1,0,70.71068,0,0,1.146447)}66.667%{transform:matrix3d(0.5,0,0,0.00433,0,-1,0,0,0,0,-1,0,86.60254,0,0,1.25)}70.833%{transform:matrix3d(0.258819,0,0,0.00483,0,-1,0,0,0,0,-1,0,96.59258,0,0,1.37059)}75%{transform:matrix3d(0,0,0,0.005,0,-1,0,0,0,0,-1,0,100,0,0,1.5)}79.167%{transform:matrix3d(-0.258819,0,0,0.00483,0,-1,0,0,0,0,-1,0,96.59258,0,0,1.62941)}83.333%{transform:matrix3d(-0.5,0,0,0.00433,0,-1,0,0,0,0,-1,0,86.60254,0,0,1.75)}87.5%{transform:matrix3d(-0.707107,0,0,0.003536,0,-1,0,0,0,0,-1,0,70.71068,0,0,1.853553)}91.667%{transform:matrix3d(-0.866025,0,0,0.0025,0,-1,0,0,0,0,-1,0,50,0,0,1.933013)}95.833%{transform:matrix3d(-0.965926,0,0,0.001294,0,-1,0,0,0,0,-1,0,25.8819,0,0,1.982963)}
}@keyframes cl{100%,0%{transform:matrix3d(0,0,0,-0.005,0,0,1,0,0,-1,0,0,-100,0,0,1.5)}4.167%{transform:matrix3d(0.258819,0,0,-0.00483,0,0,1,0,0,-1,0,0,-96.59258,0,0,1.37059)}8.333%{transform:matrix3d(0.5,0,0,-0.00433,0,0,1,0,0,-1,0,0,-86.60254,0,0,1.25)}12.5%{transform:matrix3d(0.707107,0,0,-0.003536,0,0,1,0,0,-1,0,0,-70.71068,0,0,1.146447)}16.667%{transform:matrix3d(0.866025,0,0,-0.0025,0,0,1,0,0,-1,0,0,-50,0,0,1.066987)}20.833%{transform:matrix3d(0.965926,0,0,-0.001294,0,0,1,0,0,-1,0,0,-25.8819,0,0,1.017037)}25%{transform:matrix3d(1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,1)}29.167%{transform:matrix3d(0.965926,0,0,0.001294,0,0,1,0,0,-1,0,0,25.8819,0,0,1.017037)}33.333%{transform:matrix3d(0.866025,0,0,0.0025,0,0,1,0,0,-1,0,0,50,0,0,1.066987)}37.5%{transform:matrix3d(0.707107,0,0,0.003536,0,0,1,0,0,-1,0,0,70.71068,0,0,1.146447)}41.667%{transform:matrix3d(0.5,0,0,0.00433,0,0,1,0,0,-1,0,0,86.60254,0,0,1.25)}45.833%{transform:matrix3d(0.258819,0,0,0.00483,0,0,1,0,0,-1,0,0,96.59258,0,0,1.37059)}50%{transform:matrix3d(0,0,0,0.005,0,0,1,0,0,-1,0,0,100,0,0,1.5)}54.167%{transform:matrix3d(-0.258819,0,0,0.00483,0,0,1,0,0,-1,0,0,96.59258,0,0,1.62941)}58.333%{transform:matrix3d(-0.5,0,0,0.00433,0,0,1,0,0,-1,0,0,86.60254,0,0,1.75)}62.5%{transform:matrix3d(-0.707107,0,0,0.003536,0,0,1,0,0,-1,0,0,70.71068,0,0,1.853553)}66.667%{transform:matrix3d(-0.866025,0,0,0.0025,0,0,1,0,0,-1,0,0,50,0,0,1.933013)}70.833%{transform:matrix3d(-0.965926,0,0,0.001294,0,0,1,0,0,-1,0,0,25.8819,0,0,1.982963)}75%{transform:matrix3d(-1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,2)}79.167%{transform:matrix3d(-0.965926,0,0,-0.001294,0,0,1,0,0,-1,0,0,-25.8819,0,0,1.982963)}83.333%{transform:matrix3d(-0.866025,0,0,-0.0025,0,0,1,0,0,-1,0,0,-50,0,0,1.933013)}87.5%{transform:matrix3d(-0.707107,0,0,-0.003536,0,0,1,0,0,-1,0,0,-70.71068,0,0,1.853553)}91.667%{transform:matrix3d(-0.5,0,0,-0.00433,0,0,1,0,0,-1,0,0,-86.60254,0,0,1.75)}95.833%{transform:matrix3d(-0.258819,0,0,-0.00483,0,0,1,0,0,-1,0,0,-96.59258,0,0,1.62941)}
}
}}<div class="scene"><div class="t"><div class="tc" style="animation:8s step-end infinite cf !important"><div class="rf" style="background:#75A7"></div><div class="rb" style="background:#5427"></div><div class="rr" style="background:#0C37"></div><div class="rl" style="background:#1B77"></div><div class="rt" style="background:#0457"></div><div class="rm" style="background:#5337"></div></div><div class="tc" style="animation:8s step-end infinite cr !important"><div class="rf" style="background:#0477"></div><div class="rb" style="background:#FD27"></div><div class="rt" style="background:#7B37"></div><div class="rm" style="background:#0F47"></div></div><div class="tc" style="animation:8s step-end infinite cb !important"><div class="rf" style="background:#34E7"></div><div class="rb" style="background:#3E97"></div><div class="rr" style="background:#A6B7"></div><div class="rl" style="background:#4107"></div><div class="rt" style="background:#F987"></div><div class="rm" style="background:#EAD7"></div></div><div class="tc" style="animation:8s step-end infinite cl !important"><div class="rf" style="background:#F857"></div><div class="rb" style="background:#13D7"></div><div class="rt" style="background:#FE97"></div><div class="rm" style="background:#E8E7"></div></div></div></div>

Rotating CSS Tesseract Jr.

2024-05-01T07:11:30Z

Pseudosphere:

Rotating CSS Tesseract Jr.

2024-03-02T05:40:12Z

Pseudosphere:

Rotating CSS Tesseract Jr.

2024-03-02T05:10:03Z

Pseudosphere:

{{JuniorPage}}{{#css:.scene{height:200px;margin:100px;perspective:600px;transform:scale(0.5);width:200px;}.t-c{height:100%;position:absolute;transform-style:preserve-3d;width:100%;}.r-front,.r-right,.r-back,.r-left,.r-top,.r-bottom{height:200px;position:absolute;width:200px;}.t{animation:8s linear infinite rotateyly !important;height:100%;position:relative;transform-style:preserve-3d;width:100%;}.r-front{transform:rotateY(0deg)translateZ(100px);}.r-right{transform:rotateY(90deg)translateZ(100px);}.r-back{transform:rotateY(180deg)translateZ(100px);}.r-left{transform:rotateY(-90deg)translateZ(100px);}.r-top{transform:rotateX(90deg)translateZ(100px);}.r-bottom{transform:rotateX(-90deg)translateZ(100px);}@keyframes rotateyly{0%{transform:rotate3d(-1,1,0,45deg)rotateX(0turn);}100%{transform:rotate3d(-1,1,0,45deg)rotateX(1turn);}
}@keyframes c-front{100%,0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);}6.25%{transform:matrix3d(0.9238795325112867,0,0,0.001913417161825449,0,1,0,0,0,0,1,0,38.268343236508976,0,0,1.0380602337443565);}12.5%{transform:matrix3d(0.7071067811865476,0,0,0.0035355339059327372,0,1,0,0,0,0,1,0,70.71067811865474,0,0,1.1464466094067263);}18.75%{transform:matrix3d(0.38268343236508984,0,0,0.004619397662556434,0,1,0,0,0,0,1,0,92.38795325112868,0,0,1.3086582838174552);}25%{transform:matrix3d(0,0,0,0.005,0,1,0,0,0,0,1,0,100,0,0,1.5);}31.25%{transform:matrix3d(-0.3826834323650897,0,0,0.004619397662556434,0,1,0,0,0,0,1,0,92.38795325112868,0,0,1.6913417161825448);}37.5%{transform:matrix3d(-0.7071067811865475,0,0,0.003535533905932738,0,1,0,0,0,0,1,0,70.71067811865476,0,0,1.8535533905932737);}43.75%{transform:matrix3d(-0.9238795325112867,0,0,0.0019134171618254495,0,1,0,0,0,0,1,0,38.26834323650899,0,0,1.9619397662556435);}50%{transform:matrix3d(-1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,2);}56.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,1,0,0,0,0,1,0,-38.26834323650897,0,0,1.9619397662556435);}62.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,1,0,0,0,0,1,0,-70.71067811865474,0,0,1.853553390593274);}68.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,1,0,0,0,0,1,0,-92.38795325112865,0,0,1.6913417161825453);}75%{transform:matrix3d(0,0,0,-0.005,0,1,0,0,0,0,1,0,-100,0,0,1.5);}81.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,1,0,0,0,0,1,0,-92.38795325112866,0,0,1.308658283817455);}87.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,1,0,0,0,0,1,0,-70.71067811865477,0,0,1.1464466094067263);}93.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,1,0,0,0,0,1,0,-38.26834323650904,0,0,1.0380602337443567);}
}@keyframes c-right{100%,0%{transform:matrix3d(0,0,0,0.005,0,0,-1,0,0,1,0,0,100,0,0,1.5);}6.25%{transform:matrix3d(-0.3826834323650897,0,0,0.004619397662556434,0,0,-1,0,0,1,0,0,92.38795325112868,0,0,1.6913417161825448);}12.5%{transform:matrix3d(-0.7071067811865475,0,0,0.003535533905932738,0,0,-1,0,0,1,0,0,70.71067811865476,0,0,1.8535533905932737);}18.75%{transform:matrix3d(-0.9238795325112867,0,0,0.0019134171618254495,0,0,-1,0,0,1,0,0,38.26834323650899,0,0,1.9619397662556435);}25%{transform:matrix3d(-1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,2);}31.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,0,-1,0,0,1,0,0,-38.26834323650897,0,0,1.9619397662556435);}37.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,0,-1,0,0,1,0,0,-70.71067811865474,0,0,1.853553390593274);}43.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,0,-1,0,0,1,0,0,-92.38795325112865,0,0,1.6913417161825453);}50%{transform:matrix3d(0,0,0,-0.005,0,0,-1,0,0,1,0,0,-100,0,0,1.5);}56.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,0,-1,0,0,1,0,0,-92.38795325112866,0,0,1.308658283817455);}62.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,0,-1,0,0,1,0,0,-70.71067811865477,0,0,1.1464466094067263);}68.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,0,-1,0,0,1,0,0,-38.26834323650904,0,0,1.0380602337443567);}75%{transform:matrix3d(1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,1);}81.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,0,-1,0,0,1,0,0,38.268343236509,0,0,1.0380602337443565);}87.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,0,-1,0,0,1,0,0,70.71067811865474,0,0,1.146446609406726);}93.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,0,-1,0,0,1,0,0,92.38795325112865,0,0,1.3086582838174547);}
}@keyframes c-back{100%,0%{transform:matrix3d(-1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,2);}6.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,-1,0,0,0,0,-1,0,-38.26834323650897,0,0,1.9619397662556435);}12.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,-1,0,0,0,0,-1,0,-70.71067811865474,0,0,1.853553390593274);}18.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,-1,0,0,0,0,-1,0,-92.38795325112865,0,0,1.6913417161825453);}25%{transform:matrix3d(0,0,0,-0.005,0,-1,0,0,0,0,-1,0,-100,0,0,1.5);}31.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,-1,0,0,0,0,-1,0,-92.38795325112866,0,0,1.308658283817455);}37.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,-1,0,0,0,0,-1,0,-70.71067811865477,0,0,1.1464466094067263);}43.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,-1,0,0,0,0,-1,0,-38.26834323650904,0,0,1.0380602337443567);}50%{transform:matrix3d(1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,1);}56.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,-1,0,0,0,0,-1,0,38.268343236509,0,0,1.0380602337443565);}62.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,-1,0,0,0,0,-1,0,70.71067811865474,0,0,1.146446609406726);}68.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,-1,0,0,0,0,-1,0,92.38795325112865,0,0,1.3086582838174547);}75%{transform:matrix3d(0,0,0,0.005,0,-1,0,0,0,0,-1,0,100,0,0,1.4999999999999998);}81.25%{transform:matrix3d(-0.3826834323650899,0,0,0.004619397662556434,0,-1,0,0,0,0,-1,0,92.38795325112868,0,0,1.6913417161825448);}87.5%{transform:matrix3d(-0.7071067811865467,0,0,0.003535533905932742,0,-1,0,0,0,0,-1,0,70.71067811865484,0,0,1.8535533905932733);}93.75%{transform:matrix3d(-0.9238795325112864,0,0,0.0019134171618254525,0,-1,0,0,0,0,-1,0,38.268343236509054,0,0,1.9619397662556433);}
}@keyframes c-left{100%,0%{transform:matrix3d(0,0,0,-0.005,0,0,1,0,0,-1,0,0,-100,0,0,1.5);}6.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,0,1,0,0,-1,0,0,-92.38795325112866,0,0,1.308658283817455);}12.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,0,1,0,0,-1,0,0,-70.71067811865477,0,0,1.1464466094067263);}18.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,0,1,0,0,-1,0,0,-38.26834323650904,0,0,1.0380602337443567);}25%{transform:matrix3d(1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,1);}31.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,0,1,0,0,-1,0,0,38.268343236509,0,0,1.0380602337443565);}37.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,0,1,0,0,-1,0,0,70.71067811865474,0,0,1.146446609406726);}43.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,0,1,0,0,-1,0,0,92.38795325112865,0,0,1.3086582838174547);}50%{transform:matrix3d(0,0,0,0.005,0,0,1,0,0,-1,0,0,100,0,0,1.4999999999999998);}56.25%{transform:matrix3d(-0.3826834323650899,0,0,0.004619397662556434,0,0,1,0,0,-1,0,0,92.38795325112868,0,0,1.6913417161825448);}62.5%{transform:matrix3d(-0.7071067811865467,0,0,0.003535533905932742,0,0,1,0,0,-1,0,0,70.71067811865484,0,0,1.8535533905932733);}68.75%{transform:matrix3d(-0.9238795325112864,0,0,0.0019134171618254525,0,0,1,0,0,-1,0,0,38.268343236509054,0,0,1.9619397662556433);}75%{transform:matrix3d(-1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,2);}81.25%{transform:matrix3d(-0.9238795325112867,0,0,-0.0019134171618254492,0,0,1,0,0,-1,0,0,-38.26834323650898,0,0,1.9619397662556435);}87.5%{transform:matrix3d(-0.7071067811865471,0,0,-0.0035355339059327394,0,0,1,0,0,-1,0,0,-70.71067811865478,0,0,1.8535533905932735);}93.75%{transform:matrix3d(-0.38268343236509056,0,0,-0.004619397662556432,0,0,1,0,0,-1,0,0,-92.38795325112864,0,0,1.6913417161825453);}
}
}}<div class="scene"><div class="t"><div class="t-c" style="animation:8s step-end infinite c-front !important;"><div class="r-front" style="background:#75A7;"></div><div class="r-back" style="background:#5427;"></div><div class="r-right" style="background:#0C37;"></div><div class="r-left" style="background:#1B77;"></div><div class="r-top" style="background:#0457;"></div><div class="r-bottom" style="background:#5337;"></div></div><div class="t-c" style="animation:8s step-end infinite c-right !important;"><div class="r-front" style="background:#0477;"></div><div class="r-back" style="background:#FD27;"></div><div class="r-top" style="background:#7B37;"></div><div class="r-bottom" style="background:#0F47;"></div></div><div class="t-c" style="animation:8s step-end infinite c-back !important;"><div class="r-front" style="background:#34E7;"></div><div class="r-back" style="background:#3E97;"></div><div class="r-right" style="background:#A6B7;"></div><div class="r-left" style="background:#4107;"></div><div class="r-top" style="background:#F987;"></div><div class="r-bottom" style="background:#EAD7;"></div></div><div class="t-c" style="animation:8s step-end infinite c-left !important;"><div class="r-front" style="background:#F857;"></div><div class="r-back" style="background:#13D7;"></div><div class="r-top" style="background:#FE97;"></div><div class="r-bottom" style="background:#E8E7;"></div></div></div></div>

Rotating CSS Tesseract Jr.

2024-02-24T01:28:51Z

Pseudosphere:

{{JuniorPage}}{{#css:.scene{height:200px;margin:100px;perspective:600px;transform:scale(0.5);width:200px;}.tesseract-cell{height:100%;position:absolute;transform-style:preserve-3d;width:100%;}.ridge-front,.ridge-right,.ridge-back,.ridge-left,.ridge-top,.ridge-bottom{height:200px;position:absolute;width:200px;}.tesseract{animation:8s linear infinite rotateyly;height:100%;position:relative;transform-style:preserve-3d;width:100%;}.ridge-front{transform:rotateY(0deg)translateZ(100px);}.ridge-right{transform:rotateY(90deg)translateZ(100px);}.ridge-back{transform:rotateY(180deg)translateZ(100px);}.ridge-left{transform:rotateY(-90deg)translateZ(100px);}.ridge-top{transform:rotateX(90deg)translateZ(100px);}.ridge-bottom{transform:rotateX(-90deg)translateZ(100px);}@keyframes rotateyly{0%{transform:rotate3d(-1,1,0,45deg)rotateX(0turn);}100%{transform:rotate3d(-1,1,0,45deg)rotateX(1turn);}
}@keyframes cell-front{100%,0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);}6.25%{transform:matrix3d(0.9238795325112867,0,0,0.001913417161825449,0,1,0,0,0,0,1,0,38.268343236508976,0,0,1.0380602337443565);}12.5%{transform:matrix3d(0.7071067811865476,0,0,0.0035355339059327372,0,1,0,0,0,0,1,0,70.71067811865474,0,0,1.1464466094067263);}18.75%{transform:matrix3d(0.38268343236508984,0,0,0.004619397662556434,0,1,0,0,0,0,1,0,92.38795325112868,0,0,1.3086582838174552);}25%{transform:matrix3d(0,0,0,0.005,0,1,0,0,0,0,1,0,100,0,0,1.5);}31.25%{transform:matrix3d(-0.3826834323650897,0,0,0.004619397662556434,0,1,0,0,0,0,1,0,92.38795325112868,0,0,1.6913417161825448);}37.5%{transform:matrix3d(-0.7071067811865475,0,0,0.003535533905932738,0,1,0,0,0,0,1,0,70.71067811865476,0,0,1.8535533905932737);}43.75%{transform:matrix3d(-0.9238795325112867,0,0,0.0019134171618254495,0,1,0,0,0,0,1,0,38.26834323650899,0,0,1.9619397662556435);}50%{transform:matrix3d(-1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,2);}56.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,1,0,0,0,0,1,0,-38.26834323650897,0,0,1.9619397662556435);}62.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,1,0,0,0,0,1,0,-70.71067811865474,0,0,1.853553390593274);}68.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,1,0,0,0,0,1,0,-92.38795325112865,0,0,1.6913417161825453);}75%{transform:matrix3d(0,0,0,-0.005,0,1,0,0,0,0,1,0,-100,0,0,1.5);}81.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,1,0,0,0,0,1,0,-92.38795325112866,0,0,1.308658283817455);}87.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,1,0,0,0,0,1,0,-70.71067811865477,0,0,1.1464466094067263);}93.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,1,0,0,0,0,1,0,-38.26834323650904,0,0,1.0380602337443567);}
}@keyframes cell-right{100%,0%{transform:matrix3d(0,0,0,0.005,0,0,-1,0,0,1,0,0,100,0,0,1.5);}6.25%{transform:matrix3d(-0.3826834323650897,0,0,0.004619397662556434,0,0,-1,0,0,1,0,0,92.38795325112868,0,0,1.6913417161825448);}12.5%{transform:matrix3d(-0.7071067811865475,0,0,0.003535533905932738,0,0,-1,0,0,1,0,0,70.71067811865476,0,0,1.8535533905932737);}18.75%{transform:matrix3d(-0.9238795325112867,0,0,0.0019134171618254495,0,0,-1,0,0,1,0,0,38.26834323650899,0,0,1.9619397662556435);}25%{transform:matrix3d(-1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,2);}31.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,0,-1,0,0,1,0,0,-38.26834323650897,0,0,1.9619397662556435);}37.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,0,-1,0,0,1,0,0,-70.71067811865474,0,0,1.853553390593274);}43.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,0,-1,0,0,1,0,0,-92.38795325112865,0,0,1.6913417161825453);}50%{transform:matrix3d(0,0,0,-0.005,0,0,-1,0,0,1,0,0,-100,0,0,1.5);}56.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,0,-1,0,0,1,0,0,-92.38795325112866,0,0,1.308658283817455);}62.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,0,-1,0,0,1,0,0,-70.71067811865477,0,0,1.1464466094067263);}68.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,0,-1,0,0,1,0,0,-38.26834323650904,0,0,1.0380602337443567);}75%{transform:matrix3d(1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,1);}81.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,0,-1,0,0,1,0,0,38.268343236509,0,0,1.0380602337443565);}87.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,0,-1,0,0,1,0,0,70.71067811865474,0,0,1.146446609406726);}93.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,0,-1,0,0,1,0,0,92.38795325112865,0,0,1.3086582838174547);}
}@keyframes cell-back{100%,0%{transform:matrix3d(-1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,2);}6.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,-1,0,0,0,0,-1,0,-38.26834323650897,0,0,1.9619397662556435);}12.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,-1,0,0,0,0,-1,0,-70.71067811865474,0,0,1.853553390593274);}18.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,-1,0,0,0,0,-1,0,-92.38795325112865,0,0,1.6913417161825453);}25%{transform:matrix3d(0,0,0,-0.005,0,-1,0,0,0,0,-1,0,-100,0,0,1.5);}31.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,-1,0,0,0,0,-1,0,-92.38795325112866,0,0,1.308658283817455);}37.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,-1,0,0,0,0,-1,0,-70.71067811865477,0,0,1.1464466094067263);}43.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,-1,0,0,0,0,-1,0,-38.26834323650904,0,0,1.0380602337443567);}50%{transform:matrix3d(1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,1);}56.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,-1,0,0,0,0,-1,0,38.268343236509,0,0,1.0380602337443565);}62.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,-1,0,0,0,0,-1,0,70.71067811865474,0,0,1.146446609406726);}68.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,-1,0,0,0,0,-1,0,92.38795325112865,0,0,1.3086582838174547);}75%{transform:matrix3d(0,0,0,0.005,0,-1,0,0,0,0,-1,0,100,0,0,1.4999999999999998);}81.25%{transform:matrix3d(-0.3826834323650899,0,0,0.004619397662556434,0,-1,0,0,0,0,-1,0,92.38795325112868,0,0,1.6913417161825448);}87.5%{transform:matrix3d(-0.7071067811865467,0,0,0.003535533905932742,0,-1,0,0,0,0,-1,0,70.71067811865484,0,0,1.8535533905932733);}93.75%{transform:matrix3d(-0.9238795325112864,0,0,0.0019134171618254525,0,-1,0,0,0,0,-1,0,38.268343236509054,0,0,1.9619397662556433);}
}@keyframes cell-left{100%,0%{transform:matrix3d(0,0,0,-0.005,0,0,1,0,0,-1,0,0,-100,0,0,1.5);}6.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,0,1,0,0,-1,0,0,-92.38795325112866,0,0,1.308658283817455);}12.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,0,1,0,0,-1,0,0,-70.71067811865477,0,0,1.1464466094067263);}18.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,0,1,0,0,-1,0,0,-38.26834323650904,0,0,1.0380602337443567);}25%{transform:matrix3d(1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,1);}31.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,0,1,0,0,-1,0,0,38.268343236509,0,0,1.0380602337443565);}37.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,0,1,0,0,-1,0,0,70.71067811865474,0,0,1.146446609406726);}43.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,0,1,0,0,-1,0,0,92.38795325112865,0,0,1.3086582838174547);}50%{transform:matrix3d(0,0,0,0.005,0,0,1,0,0,-1,0,0,100,0,0,1.4999999999999998);}56.25%{transform:matrix3d(-0.3826834323650899,0,0,0.004619397662556434,0,0,1,0,0,-1,0,0,92.38795325112868,0,0,1.6913417161825448);}62.5%{transform:matrix3d(-0.7071067811865467,0,0,0.003535533905932742,0,0,1,0,0,-1,0,0,70.71067811865484,0,0,1.8535533905932733);}68.75%{transform:matrix3d(-0.9238795325112864,0,0,0.0019134171618254525,0,0,1,0,0,-1,0,0,38.268343236509054,0,0,1.9619397662556433);}75%{transform:matrix3d(-1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,2);}81.25%{transform:matrix3d(-0.9238795325112867,0,0,-0.0019134171618254492,0,0,1,0,0,-1,0,0,-38.26834323650898,0,0,1.9619397662556435);}87.5%{transform:matrix3d(-0.7071067811865471,0,0,-0.0035355339059327394,0,0,1,0,0,-1,0,0,-70.71067811865478,0,0,1.8535533905932735);}93.75%{transform:matrix3d(-0.38268343236509056,0,0,-0.004619397662556432,0,0,1,0,0,-1,0,0,-92.38795325112864,0,0,1.6913417161825453);}
}
}}<div class="scene"><div class="tesseract"><div class="tesseract-cell" style="animation:8s step-end infinite cell-front;"><div class="ridge-front" style="background-color:#75A7;"></div><div class="ridge-back" style="background-color:#5427;"></div><div class="ridge-right" style="background-color:#0C37;"></div><div class="ridge-left" style="background-color:#1B77;"></div><div class="ridge-top" style="background-color:#0457;"></div><div class="ridge-bottom" style="background-color:#5337;"></div></div><div class="tesseract-cell" style="animation:8s step-end infinite cell-right;"><div class="ridge-front" style="background-color:#0477;"></div><div class="ridge-back" style="background-color:#FD27;"></div><div class="ridge-top" style="background-color:#7B37;"></div><div class="ridge-bottom" style="background-color:#0F47;"></div></div><div class="tesseract-cell" style="animation:8s step-end infinite cell-back;"><div class="ridge-front" style="background-color:#34E7;"></div><div class="ridge-back" style="background-color:#3E97;"></div><div class="ridge-right" style="background-color:#A6B7;"></div><div class="ridge-left" style="background-color:#4107;"></div><div class="ridge-top" style="background-color:#F987;"></div><div class="ridge-bottom" style="background-color:#EAD7;"></div></div><div class="tesseract-cell" style="animation:8s step-end infinite cell-left;"><div class="ridge-front" style="background-color:#F857;"></div><div class="ridge-back" style="background-color:#13D7;"></div><div class="ridge-top" style="background-color:#FE97;"></div><div class="ridge-bottom" style="background-color:#E8E7;"></div></div></div></div>

Rotating CSS Tesseract Jr.

2024-02-24T01:06:22Z

Pseudosphere: Created page with "{{JuniorPage}}{{#css:.scene{height:200px;margin:100px;perspective:600px;width:200px;}.tesseract-cell{height:100%;position:absolute;transform-style:preserve-3d;width:100%;}.ridge-front,.ridge-right,.ridge-back,.ridge-left,.ridge-top,.ridge-bottom{height:200px;position:absolute;width:200px;}.tesseract{animation:8s linear infinite rotateyly;height:100%;position:relative;transform-style:preserve-3d;width:100%;}.ridge-front{transform:rotateY(0deg)translateZ(100px);}.ridge-rig..."

{{JuniorPage}}{{#css:.scene{height:200px;margin:100px;perspective:600px;width:200px;}.tesseract-cell{height:100%;position:absolute;transform-style:preserve-3d;width:100%;}.ridge-front,.ridge-right,.ridge-back,.ridge-left,.ridge-top,.ridge-bottom{height:200px;position:absolute;width:200px;}.tesseract{animation:8s linear infinite rotateyly;height:100%;position:relative;transform-style:preserve-3d;width:100%;}.ridge-front{transform:rotateY(0deg)translateZ(100px);}.ridge-right{transform:rotateY(90deg)translateZ(100px);}.ridge-back{transform:rotateY(180deg)translateZ(100px);}.ridge-left{transform:rotateY(-90deg)translateZ(100px);}.ridge-top{transform:rotateX(90deg)translateZ(100px);}.ridge-bottom{transform:rotateX(-90deg)translateZ(100px);}@keyframes rotateyly{0%{transform:rotate3d(-1,1,0,45deg)rotateX(0turn);}100%{transform:rotate3d(-1,1,0,45deg)rotateX(1turn);}
}@keyframes cell-front{100%,0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);}6.25%{transform:matrix3d(0.9238795325112867,0,0,0.001913417161825449,0,1,0,0,0,0,1,0,38.268343236508976,0,0,1.0380602337443565);}12.5%{transform:matrix3d(0.7071067811865476,0,0,0.0035355339059327372,0,1,0,0,0,0,1,0,70.71067811865474,0,0,1.1464466094067263);}18.75%{transform:matrix3d(0.38268343236508984,0,0,0.004619397662556434,0,1,0,0,0,0,1,0,92.38795325112868,0,0,1.3086582838174552);}25%{transform:matrix3d(0,0,0,0.005,0,1,0,0,0,0,1,0,100,0,0,1.5);}31.25%{transform:matrix3d(-0.3826834323650897,0,0,0.004619397662556434,0,1,0,0,0,0,1,0,92.38795325112868,0,0,1.6913417161825448);}37.5%{transform:matrix3d(-0.7071067811865475,0,0,0.003535533905932738,0,1,0,0,0,0,1,0,70.71067811865476,0,0,1.8535533905932737);}43.75%{transform:matrix3d(-0.9238795325112867,0,0,0.0019134171618254495,0,1,0,0,0,0,1,0,38.26834323650899,0,0,1.9619397662556435);}50%{transform:matrix3d(-1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,2);}56.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,1,0,0,0,0,1,0,-38.26834323650897,0,0,1.9619397662556435);}62.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,1,0,0,0,0,1,0,-70.71067811865474,0,0,1.853553390593274);}68.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,1,0,0,0,0,1,0,-92.38795325112865,0,0,1.6913417161825453);}75%{transform:matrix3d(0,0,0,-0.005,0,1,0,0,0,0,1,0,-100,0,0,1.5);}81.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,1,0,0,0,0,1,0,-92.38795325112866,0,0,1.308658283817455);}87.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,1,0,0,0,0,1,0,-70.71067811865477,0,0,1.1464466094067263);}93.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,1,0,0,0,0,1,0,-38.26834323650904,0,0,1.0380602337443567);}
}@keyframes cell-right{100%,0%{transform:matrix3d(0,0,0,0.005,0,0,-1,0,0,1,0,0,100,0,0,1.5);}6.25%{transform:matrix3d(-0.3826834323650897,0,0,0.004619397662556434,0,0,-1,0,0,1,0,0,92.38795325112868,0,0,1.6913417161825448);}12.5%{transform:matrix3d(-0.7071067811865475,0,0,0.003535533905932738,0,0,-1,0,0,1,0,0,70.71067811865476,0,0,1.8535533905932737);}18.75%{transform:matrix3d(-0.9238795325112867,0,0,0.0019134171618254495,0,0,-1,0,0,1,0,0,38.26834323650899,0,0,1.9619397662556435);}25%{transform:matrix3d(-1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,2);}31.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,0,-1,0,0,1,0,0,-38.26834323650897,0,0,1.9619397662556435);}37.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,0,-1,0,0,1,0,0,-70.71067811865474,0,0,1.853553390593274);}43.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,0,-1,0,0,1,0,0,-92.38795325112865,0,0,1.6913417161825453);}50%{transform:matrix3d(0,0,0,-0.005,0,0,-1,0,0,1,0,0,-100,0,0,1.5);}56.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,0,-1,0,0,1,0,0,-92.38795325112866,0,0,1.308658283817455);}62.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,0,-1,0,0,1,0,0,-70.71067811865477,0,0,1.1464466094067263);}68.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,0,-1,0,0,1,0,0,-38.26834323650904,0,0,1.0380602337443567);}75%{transform:matrix3d(1,0,0,0,0,0,-1,0,0,1,0,0,0,0,0,1);}81.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,0,-1,0,0,1,0,0,38.268343236509,0,0,1.0380602337443565);}87.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,0,-1,0,0,1,0,0,70.71067811865474,0,0,1.146446609406726);}93.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,0,-1,0,0,1,0,0,92.38795325112865,0,0,1.3086582838174547);}
}@keyframes cell-back{100%,0%{transform:matrix3d(-1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,2);}6.25%{transform:matrix3d(-0.9238795325112868,0,0,-0.0019134171618254484,0,-1,0,0,0,0,-1,0,-38.26834323650897,0,0,1.9619397662556435);}12.5%{transform:matrix3d(-0.7071067811865477,0,0,-0.0035355339059327372,0,-1,0,0,0,0,-1,0,-70.71067811865474,0,0,1.853553390593274);}18.75%{transform:matrix3d(-0.38268343236509034,0,0,-0.004619397662556432,0,-1,0,0,0,0,-1,0,-92.38795325112865,0,0,1.6913417161825453);}25%{transform:matrix3d(0,0,0,-0.005,0,-1,0,0,0,0,-1,0,-100,0,0,1.5);}31.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,-1,0,0,0,0,-1,0,-92.38795325112866,0,0,1.308658283817455);}37.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,-1,0,0,0,0,-1,0,-70.71067811865477,0,0,1.1464466094067263);}43.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,-1,0,0,0,0,-1,0,-38.26834323650904,0,0,1.0380602337443567);}50%{transform:matrix3d(1,0,0,0,0,-1,0,0,0,0,-1,0,0,0,0,1);}56.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,-1,0,0,0,0,-1,0,38.268343236509,0,0,1.0380602337443565);}62.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,-1,0,0,0,0,-1,0,70.71067811865474,0,0,1.146446609406726);}68.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,-1,0,0,0,0,-1,0,92.38795325112865,0,0,1.3086582838174547);}75%{transform:matrix3d(0,0,0,0.005,0,-1,0,0,0,0,-1,0,100,0,0,1.4999999999999998);}81.25%{transform:matrix3d(-0.3826834323650899,0,0,0.004619397662556434,0,-1,0,0,0,0,-1,0,92.38795325112868,0,0,1.6913417161825448);}87.5%{transform:matrix3d(-0.7071067811865467,0,0,0.003535533905932742,0,-1,0,0,0,0,-1,0,70.71067811865484,0,0,1.8535533905932733);}93.75%{transform:matrix3d(-0.9238795325112864,0,0,0.0019134171618254525,0,-1,0,0,0,0,-1,0,38.268343236509054,0,0,1.9619397662556433);}
}@keyframes cell-left{100%,0%{transform:matrix3d(0,0,0,-0.005,0,0,1,0,0,-1,0,0,-100,0,0,1.5);}6.25%{transform:matrix3d(0.38268343236509,0,0,-0.004619397662556433,0,0,1,0,0,-1,0,0,-92.38795325112866,0,0,1.308658283817455);}12.5%{transform:matrix3d(0.7071067811865474,0,0,-0.0035355339059327385,0,0,1,0,0,-1,0,0,-70.71067811865477,0,0,1.1464466094067263);}18.75%{transform:matrix3d(0.9238795325112865,0,0,-0.001913417161825452,0,0,1,0,0,-1,0,0,-38.26834323650904,0,0,1.0380602337443567);}25%{transform:matrix3d(1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,1);}31.25%{transform:matrix3d(0.9238795325112867,0,0,0.0019134171618254497,0,0,1,0,0,-1,0,0,38.268343236509,0,0,1.0380602337443565);}37.5%{transform:matrix3d(0.7071067811865477,0,0,0.003535533905932737,0,0,1,0,0,-1,0,0,70.71067811865474,0,0,1.146446609406726);}43.75%{transform:matrix3d(0.38268343236509045,0,0,0.004619397662556432,0,0,1,0,0,-1,0,0,92.38795325112865,0,0,1.3086582838174547);}50%{transform:matrix3d(0,0,0,0.005,0,0,1,0,0,-1,0,0,100,0,0,1.4999999999999998);}56.25%{transform:matrix3d(-0.3826834323650899,0,0,0.004619397662556434,0,0,1,0,0,-1,0,0,92.38795325112868,0,0,1.6913417161825448);}62.5%{transform:matrix3d(-0.7071067811865467,0,0,0.003535533905932742,0,0,1,0,0,-1,0,0,70.71067811865484,0,0,1.8535533905932733);}68.75%{transform:matrix3d(-0.9238795325112864,0,0,0.0019134171618254525,0,0,1,0,0,-1,0,0,38.268343236509054,0,0,1.9619397662556433);}75%{transform:matrix3d(-1,0,0,0,0,0,1,0,0,-1,0,0,0,0,0,2);}81.25%{transform:matrix3d(-0.9238795325112867,0,0,-0.0019134171618254492,0,0,1,0,0,-1,0,0,-38.26834323650898,0,0,1.9619397662556435);}87.5%{transform:matrix3d(-0.7071067811865471,0,0,-0.0035355339059327394,0,0,1,0,0,-1,0,0,-70.71067811865478,0,0,1.8535533905932735);}93.75%{transform:matrix3d(-0.38268343236509056,0,0,-0.004619397662556432,0,0,1,0,0,-1,0,0,-92.38795325112864,0,0,1.6913417161825453);}
}
}}<div class="scene"><div class="tesseract"><div class="tesseract-cell" style="animation:8s step-end infinite cell-front;"><div class="ridge-front" style="background-color:#75A7;"></div><div class="ridge-back" style="background-color:#5427;"></div><div class="ridge-right" style="background-color:#0C37;"></div><div class="ridge-left" style="background-color:#1B77;"></div><div class="ridge-top" style="background-color:#0457;"></div><div class="ridge-bottom" style="background-color:#5337;"></div></div><div class="tesseract-cell" style="animation:8s step-end infinite cell-right;"><div class="ridge-front" style="background-color:#0477;"></div><div class="ridge-back" style="background-color:#FD27;"></div><div class="ridge-top" style="background-color:#7B37;"></div><div class="ridge-bottom" style="background-color:#0F47;"></div></div><div class="tesseract-cell" style="animation:8s step-end infinite cell-back;"><div class="ridge-front" style="background-color:#34E7;"></div><div class="ridge-back" style="background-color:#3E97;"></div><div class="ridge-right" style="background-color:#A6B7;"></div><div class="ridge-left" style="background-color:#4107;"></div><div class="ridge-top" style="background-color:#F987;"></div><div class="ridge-bottom" style="background-color:#EAD7;"></div></div><div class="tesseract-cell" style="animation:8s step-end infinite cell-left;"><div class="ridge-front" style="background-color:#F857;"></div><div class="ridge-back" style="background-color:#13D7;"></div><div class="ridge-top" style="background-color:#FE97;"></div><div class="ridge-bottom" style="background-color:#E8E7;"></div></div></div></div>