Item: simple tesseract (hypercube) in CSS
Rating: 3.4
Author: &#x2063;

0 Downloads
44 Views
Tweet
Download Now View Demo

HTML

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>simple tesseract (hypercube) in CSS</title>
  
  
  
  
  
</head>

<body>

  
<div class="pane">
  <div class="tesseract">
    <div class="cube">
      <div class="side">
        <div class="frustum">
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
        </div>
      </div>
      <div class="side">
        <div class="frustum">
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
        </div>
      </div>
      <div class="side">
        <div class="frustum">
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
        </div>
      </div>
      <div class="side">
        <div class="frustum">
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
        </div>
      </div>
      <div class="side">
        <div class="frustum">
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
        </div>
      </div>
      <div class="side">
        <div class="frustum">
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
          <div class="side"> </div>
        </div>
      </div>
    </div>
  </div>
</div>
  
  

</body>

</html>

Comments

More from ⁣

simple tesseract (hypercube) in CSS

In this example below you will see how to do a simple tesseract (hypercube) in CSS with some HTML / CSS and Javascript

basic concept for a tesseract.A tesseract is a cube with a 4th dimension

Comments

More from ⁣

pure CSS DNA

Live editing text on a canvas

3d eye | pure CSS

element queries concept

You Might Also Like

Jelly Buttons

Animal Trading Card - true to mockup

NVLKS

sprite animation testing

vue-minesweeper

Overwatch Loader v.2

Card Suits

No JS: Tabs that scale down to menu

simple tesseract (hypercube) in CSS

In this example below you will see how to do a simple tesseract (hypercube) in CSS with some HTML / CSS and Javascriptbasic concept for a tesseract.A tesseract is a cube with a 4th dimension

Comments

More from ⁣

pure CSS DNA

Live editing text on a canvas

3d eye | pure CSS

element queries concept

You Might Also Like

Jelly Buttons

Animal Trading Card - true to mockup

NVLKS

sprite animation testing

vue-minesweeper

Overwatch Loader v.2

Card Suits

No JS: Tabs that scale down to menu

In this example below you will see how to do a simple tesseract (hypercube) in CSS with some HTML / CSS and Javascript

basic concept for a tesseract.A tesseract is a cube with a 4th dimension