## CSS Fractal Studio

*Other fractal and chaos tools:*- Bifurcation Diagrams Explorer
- CSS Fractal Studio
- Chaos Game Explorer
- and many more »

- This tool creates CSS-only fractals (Garcia, 2010), patterns that repeat themselves at different length scales.
- To use the tool, select a pattern and iterate n times its generator. Setting n = 0 displays the generator.
- In some cases, neigboring building blocks can be visually resolved by adding some contrast to their borders. This is done with the tool by checking the "add borders contrast" checkbox before submitting the form.
- To prevent web browsers from crashing, we have limited the number of iterations. This limit may be different for different patterns. In general, resolution and processing time increases with n.
- Feel free to use the html/css source of a generated fractal as you please.

- Fractals have widespread applications: from graphics design to fabrics design, and from the study of complex electrodes to the study of diffusion-limited aggregation phenomena and electrochemical deposition of metals. Even some antennas of cell phones are shaped as Sierpinski Carpets, a family of well known fractals.
- The tool was inspired in the concept of iterating CSS-only layouts as a web page design technique (Garcia, 2010).
- This technique lets users generate fractals after just a few number of iterations, without resourcing to complex mathematical expressions or random algorithms. This is faster than dissecting a computer window into smaller pixels and then creating fractals by coloring individual pixels. Instead of requiring a hundred or thousand of iterations to generate a 2-dimensional fractal or multifractal, only a few (≤ 6) are needed.
**Computing Fractal Dimensions**

To create a fractal we need an initiator, a generator, and a scaling factor. For fractals that belong to the Sierpinski family, the initiator is a square canvas of length L = 1 and area A = L^{2}= 1.

This canvas is partitioned into b^{2}smaller squares of length L(1/b) = L*1/b = 1/b and area A(1/b) = A*(1/b)^{2}= (1/b)^{2}, where b = 2, 3, 4... So b and therefore 1/b, is a scale factor.

The generator consists of N smaller squares to be removed and b^{2}- N smaller squares to be retained. The generator is then iterated within the retained squares and the fractal dimension D is computed as

D = log(b^{2}- N)/log(b)

where the probability that b^{2}- N parts remain in the fractal is

p = (b^{2}- N)/b^{2}= 1 - N/b^{2}

For instance for the Sierpinski Carpet, b = 3, N = 1, and p = 8/9 = 0.88... so D = log(8)/log(3) = 1.89.**Applications of Binary Fractals to Long Genetic Sequences via a Kronecker Family of Genetic Matrices**

A recent report (Stepanyan & Petoukhov, 2017) shows that long nucleotide sequences can be modeled and analyzed with fractal carpets constructed from binary fractals by means of Kronecker exponentiation of matrices. The article abstract reads:"The article is devoted to a matrix method of comparative analysis of long nucleotide sequences by means of presenting each sequence in the form of three digital binary sequences. This method uses a set of symmetries of biochemical attributes of nucleotides. It also uses the possibility of presentation of every whole set of N-mers as one of the members of a Kronecker family of genetic matrices. With this method, a long nucleotide sequence can be visually represented as an individual fractal-like mosaic or another regular mosaic of binary type. In contrast to natural nucleotide sequences, artificial random sequences give non-regular patterns. Examples of binary mosaics of long nucleotide sequences are shown, including cases of human chromosomes and penicillins. The obtained results are then discussed."

We have incorporated the fractal that resembles the pattern of the nucleotide sequence

*Homo sapiens*chromosome 22 genomic scaffold into our Fractal Studio tool. Researchers can reproduce the resultant binary mosaic as they please by simply selecting the*Homo Sapiens Mosaic*option from the tool selection menu and setting n = 2. It is not necessary to add contrast to borders. Compare results with Figures 4 and 8 of Stepanyan & Petoukhov article. Compare also some of the multifractal patterns that the tool generates with some of the genetic mosaics described in the article. Multidisciplinary research is a beautiful thing.

- Teachers, students, or anyone working with fractals.
- Users with a basic knowledge of fractal geometry.

- Compute fractal dimensions for the following
- Sierpinski Triangle and Gasket
- Vicsek 1 and 2
- Dhan Carpet

- Garcia, E (2010). A Web Browser Approach to the Design of Fractals and Multifractals - Experiments with Fractals. This is a legacy article at CiteSeer, so some links in it are broken.
- Mandelbrot, B. B. (1983). The Fractal Geometry of Nature. Freeman, New York. Devaney, R. L. (1989a). Chaos, Fractals, and Dynamical Systems: Computer Experiments in Mathematics. Addison Wesley, New York.
- Devaney, R. L. (1989b). An Introduction to Dynamical Systems. Addison Wesley, New York.
- Devaney, R. L. (1992). A First Course in Chaotic Dyamical Systems. Addison Wesley, New York.
- Stepanyan, I. V. & Petoukhov S. V. (2017). The Matrix Method of Representation, Analysis and Classification of Long Genetic Sequences. Information 8(1), 12; https://doi.org/10.3390/info8010012. See also https://arxiv.org/ftp/arxiv/papers/1310/1310.8469.pdf.