Home▸Genetics & Evolution▸Chromatin Structure & DNA Packaging (2D)

Chromatin Structure Simulator (2D)

Interactive 2D chromatin packaging diagram: morph DNA through four packing levels — bare double helix, nucleosome beads-on-a-string, the 30-nm solenoid fibril and the mitotic chromosome — with live compaction ratios computed from nucleosome repeat length, then toggle euchromatin vs heterochromatin to see gene accessibility change.

Genetics & Evolution2DModerate60 FPS📱 Mobile-adapted⇄ 3D version
2d-chromatin-structure ↗ Open standalone

This 2D canvas diagram morphs a simulated chromatin strand through the same four-level packaging hierarchy used to fit two metres of DNA inside a cell nucleus: a bare double helix winds into nucleosome "beads on a string", the beaded chain coils into a flattened 30-nm solenoid, and the coil condenses into a chromosome-like rod, with the compaction ratio at each stage computed live from the nucleosome repeat length (core 147 bp plus an adjustable linker). A second control switches the fibre between open euchromatin and densely packed heterochromatin, tracking how that switch changes whether a marked gene locus stays reachable by the transcription machinery — a compact, formula-driven view of how chromatin packing regulates gene expression.

⚙ Under the hood

2D chromatin packaging diagram with live compaction ratios derived from nucleosome repeat length, morphing through four packing levels and an euchromatin/heterochromatin toggle that changes gene accessibility.

chromatinnucleosomehistoneDNA packagingepigeneticsgenetics

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)