EN 
Українська
PolskiDNA Double Helix: Unrolled B/A/Z-Form Groove Geometry (2D)
Real B/A/Z-form helical parameters drive a flattened, "unrolled" side view of the double helix, with a live complementary-strand generator following the real A-T / G-C base-pairing rule and major/minor groove bands drawn to their true relative widths.
About this unrolled DNA helix diagram
The 3D companion spins a double helix built from a fixed sphere-and-tube geometry for visual effect — radius, turns and rung spacing are chosen for appearance rather than biology. This 2D companion instead plots the real structural parameters of DNA: each base pair is placed at axial position n·rise and angular position n·twist around the helix axis, using the actual documented values for B-DNA (10.5 bp per turn, 0.34 nm rise per base pair, 34.3° twist per base pair), and lets you switch to the real, distinct parameters of A-DNA and left-handed Z-DNA to see how rise, twist and handedness change together.
Typing a sequence — or hitting Randomize — regenerates the complementary strand using the real Watson–Crick pairing rule, never arbitrarily: A always pairs with T (2 hydrogen bonds), G always pairs with C (3 hydrogen bonds), and each rung is drawn with that many parallel dashed bond lines so the difference is visible at a glance, not just labeled. The shaded bands behind the backbones use each form's real major/minor groove widths (2.2 nm / 1.2 nm for B-DNA, reversed and narrower for A-DNA, and an almost-flattened major groove for Z-DNA) so the groove asymmetry you see is proportioned from documented structural biology rather than drawn as a uniform twisted ladder.
Frequently Asked Questions
How is this different from the 3D "Dynamic DNA Double Helix Visualization"?
The 3D version is an orbitable Three.js scene with fixed decorative proportions — it looks like DNA but its radius, rung spacing and groove shape are not tied to real structural parameters. This 2D companion plots the actual rise-per-bp, twist-per-bp and groove-width numbers published for B, A and Z-DNA, and regenerates a real complementary strand from whatever sequence you type in.
Why do A-DNA and Z-DNA look so different from B-DNA?
They are genuinely different helical conformations DNA can adopt depending on hydration and sequence, not stylistic variants. A-DNA is more compact (11 bp/turn, shorter 0.26 nm rise) with the major/minor groove asymmetry reversed from B-DNA. Z-DNA is left-handed with a zig-zag backbone, a longer repeat (12 bp/turn) and an almost flattened major groove — switching forms in the selector changes every one of these parameters together, the way it would in the real molecule.
How is the complementary strand generated?
Every character you type or randomize into the top-strand field is matched against the real Watson–Crick rule: A↔T and G↔C, nothing else. The bottom strand is never independently editable or arbitrary — it is always the true complement of whatever the top strand currently reads, and each pairing's hydrogen-bond count (2 for A-T, 3 for G-C) is drawn explicitly on the rung connecting the two backbones.
Unrolled 2D DNA helix using real B/A/Z-form rise, twist and bp/turn values; a live Watson–Crick complementary-strand generator; and major/minor groove bands scaled to each form's documented real widths.
2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install