diff --git a/src/test/java/ovh/gasser/newshapes/ui/visitors/HTMLDraftmanTest.java b/src/test/java/ovh/gasser/newshapes/ui/visitors/HTMLDraftmanTest.java
new file mode 100644
index 0000000..3e35e5e
--- /dev/null
+++ b/src/test/java/ovh/gasser/newshapes/ui/visitors/HTMLDraftmanTest.java
@@ -0,0 +1,409 @@
+package ovh.gasser.newshapes.ui.visitors;
+
+import org.junit.jupiter.api.BeforeEach;
+import org.junit.jupiter.api.Nested;
+import org.junit.jupiter.api.Test;
+import ovh.gasser.newshapes.attributes.ColorAttributes;
+import ovh.gasser.newshapes.shapes.*;
+
+import java.awt.*;
+import java.io.PrintWriter;
+import java.io.StringWriter;
+
+import static org.junit.jupiter.api.Assertions.*;
+
+class HTMLDraftmanTest {
+
+    private StringWriter htmlBuffer;
+    private StringWriter cssBuffer;
+    private PrintWriter htmlWriter;
+    private PrintWriter cssWriter;
+    private HTMLDraftman draftman;
+
+    @BeforeEach
+    void setUp() {
+        htmlBuffer = new StringWriter();
+        cssBuffer = new StringWriter();
+        htmlWriter = new PrintWriter(htmlBuffer);
+        cssWriter = new PrintWriter(cssBuffer);
+        draftman = new HTMLDraftman(htmlWriter, cssWriter);
+    }
+
+    private String html() {
+        htmlWriter.flush();
+        return htmlBuffer.toString();
+    }
+
+    private String css() {
+        cssWriter.flush();
+        return cssBuffer.toString();
+    }
+
+    // ── visitRectangle ──────────────────────────────────────────────
+
+    @Nested
+    class VisitRectangleTests {
+
+        @Test
+        void testRectangleProducesDivWithId() {
+            SRectangle rect = SRectangle.create(10, 20, 100, 50);
+            draftman.visitRectangle(rect);
+
+            assertTrue(html().contains("<div id=\"rec"), "Should produce a div with rec id");
+        }
+
+        @Test
+        void testRectangleCssContainsCorrectPosition() {
+            SRectangle rect = SRectangle.create(10, 20, 100, 50);
+            draftman.visitRectangle(rect);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("top:20px"), "CSS should contain correct top");
+            assertTrue(cssOut.contains("left:10px"), "CSS should contain correct left");
+        }
+
+        @Test
+        void testRectangleCssContainsCorrectDimensions() {
+            SRectangle rect = SRectangle.create(10, 20, 100, 50);
+            draftman.visitRectangle(rect);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("width:100px"), "CSS should contain correct width");
+            assertTrue(cssOut.contains("height:50px"), "CSS should contain correct height");
+        }
+
+        @Test
+        void testRectangleCssPositionIsAbsolute() {
+            SRectangle rect = SRectangle.create(0, 0, 30, 30);
+            draftman.visitRectangle(rect);
+
+            assertTrue(css().contains("position:absolute"), "CSS should use absolute positioning");
+        }
+
+        @Test
+        void testRectangleHtmlIdMatchesCssSelector() {
+            SRectangle rect = SRectangle.create(0, 0, 30, 30);
+            draftman.visitRectangle(rect);
+
+            String id = "rec" + rect.hashCode();
+            assertTrue(html().contains("id=\"" + id + "\""), "HTML should contain div with correct id");
+            assertTrue(css().contains("#" + id), "CSS should reference same id");
+        }
+
+        @Test
+        void testRectangleFilledAndStroked() {
+            SRectangle rect = SRectangle.create(0, 0, 30, 30);
+            rect.addAttributes(new ColorAttributes(true, true, Color.RED, Color.BLUE));
+            draftman.visitRectangle(rect);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("background:"), "CSS should contain background");
+            assertTrue(cssOut.contains("border:"), "CSS should contain border");
+        }
+
+        @Test
+        void testRectangleFilledOnly() {
+            SRectangle rect = SRectangle.create(0, 0, 30, 30);
+            rect.addAttributes(new ColorAttributes(true, false, Color.RED, Color.BLACK));
+            draftman.visitRectangle(rect);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("background:"), "CSS should contain background for filled");
+            assertFalse(cssOut.contains("border:"), "CSS should not contain border when not stroked");
+        }
+
+        @Test
+        void testRectangleStrokedOnly() {
+            SRectangle rect = SRectangle.create(0, 0, 30, 30);
+            rect.addAttributes(new ColorAttributes(false, true, Color.RED, Color.BLUE));
+            draftman.visitRectangle(rect);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("border:"), "CSS should contain border for stroked");
+            assertTrue(cssOut.contains("background:#ffffff"), "CSS should have white background when not filled");
+        }
+
+        @Test
+        void testRectangleNeitherFilledNorStroked() {
+            SRectangle rect = SRectangle.create(0, 0, 30, 30);
+            rect.addAttributes(new ColorAttributes(false, false, Color.RED, Color.BLUE));
+            draftman.visitRectangle(rect);
+
+            String cssOut = css();
+            assertFalse(cssOut.contains("background:"), "CSS should not contain background");
+            assertFalse(cssOut.contains("border:"), "CSS should not contain border");
+        }
+    }
+
+    // ── visitCircle ─────────────────────────────────────────────────
+
+    @Nested
+    class VisitCircleTests {
+
+        @Test
+        void testCircleProducesDivWithClass() {
+            SCircle circle = SCircle.create(50, 60, 30);
+            draftman.visitCircle(circle);
+
+            assertTrue(html().contains("circle"), "HTML should contain circle class div");
+        }
+
+        @Test
+        void testCircleCssContainsBorderRadius() {
+            SCircle circle = SCircle.create(50, 60, 30);
+            draftman.visitCircle(circle);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("border-radius:"), "CSS should contain border-radius");
+            assertTrue(cssOut.contains("-webkit-border-radius:"), "CSS should contain webkit prefix");
+            assertTrue(cssOut.contains("-moz-border-radius:"), "CSS should contain moz prefix");
+        }
+
+        @Test
+        void testCircleCssContainsCorrectPosition() {
+            SCircle circle = SCircle.create(50, 60, 30);
+            draftman.visitCircle(circle);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("top:60px"), "CSS should contain correct top");
+            assertTrue(cssOut.contains("left:50px"), "CSS should contain correct left");
+        }
+
+        @Test
+        void testCircleHtmlClassMatchesCssSelector() {
+            SCircle circle = SCircle.create(0, 0, 20);
+            draftman.visitCircle(circle);
+
+            String className = "circle" + circle.hashCode();
+            assertTrue(html().contains(className), "HTML should have circle class");
+            assertTrue(css().contains("." + className), "CSS should reference same class");
+        }
+    }
+
+    // ── visitTriangle ───────────────────────────────────────────────
+
+    @Nested
+    class VisitTriangleTests {
+
+        @Test
+        void testTriangleProducesDivWithClass() {
+            STriangle tri = STriangle.create(10, 20, 40, Color.RED, Color.BLACK);
+            draftman.visitTriangle(tri);
+
+            assertTrue(html().contains("triangle"), "HTML should contain triangle class div");
+        }
+
+        @Test
+        void testTriangleCssContainsBorderTrick() {
+            STriangle tri = STriangle.create(10, 20, 40, Color.RED, Color.BLACK);
+            draftman.visitTriangle(tri);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("border-left-width:"), "CSS should use border-left-width");
+            assertTrue(cssOut.contains("border-right-width:"), "CSS should use border-right-width");
+            assertTrue(cssOut.contains("border-bottom:"), "CSS should use border-bottom");
+            assertTrue(cssOut.contains("width: 0px"), "CSS should set width to 0");
+            assertTrue(cssOut.contains("height: 0px"), "CSS should set height to 0");
+        }
+
+        @Test
+        void testTriangleCssContainsCorrectPosition() {
+            STriangle tri = STriangle.create(10, 20, 40, Color.RED, Color.BLACK);
+            draftman.visitTriangle(tri);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("top: 20px"), "CSS should contain correct top");
+            assertTrue(cssOut.contains("left: 10px"), "CSS should contain correct left");
+        }
+
+        @Test
+        void testTriangleCssContainsFillColor() {
+            STriangle tri = STriangle.create(0, 0, 20, Color.BLUE, Color.BLACK);
+            tri.addAttributes(new ColorAttributes(true, false, Color.BLUE, Color.BLACK));
+            draftman.visitTriangle(tri);
+
+            assertTrue(css().contains("#0000ff"), "CSS should contain the triangle fill color");
+        }
+
+        @Test
+        void testTriangleHtmlClassMatchesCssSelector_regressionHashCode() {
+            // Regression test: visitTriangle previously used this.hashCode()
+            // instead of sTriangle.hashCode(), causing HTML class and CSS
+            // selector mismatch when rendered by a different draftman instance.
+            STriangle tri = STriangle.create(5, 5, 30, Color.RED, Color.BLACK);
+            draftman.visitTriangle(tri);
+
+            String htmlOut = html();
+            String cssOut = css();
+
+            // Extract the class name from HTML: class="triangleNNN"
+            int classStart = htmlOut.indexOf("triangle");
+            assertNotEquals(-1, classStart, "HTML should contain triangle class");
+            int classEnd = htmlOut.indexOf("\"", classStart);
+            String htmlClassName = htmlOut.substring(classStart, classEnd);
+
+            // CSS should use the same class name
+            assertTrue(cssOut.contains("." + htmlClassName),
+                    "CSS selector should match HTML class — " +
+                    "if this fails, visitTriangle may be using this.hashCode() instead of sTriangle.hashCode()");
+        }
+    }
+
+    // ── visitText ───────────────────────────────────────────────────
+
+    @Nested
+    class VisitTextTests {
+
+        @Test
+        void testTextProducesDivWithContent() {
+            SText text = SText.create(10, 20, "Hello");
+            draftman.visitText(text);
+
+            assertTrue(html().contains(">Hello</div>"), "HTML should contain text content in div");
+        }
+
+        @Test
+        void testTextHtmlIdMatchesCssSelector() {
+            SText text = SText.create(0, 0, "Test");
+            draftman.visitText(text);
+
+            String id = "txt" + text.hashCode();
+            assertTrue(html().contains("id=\"" + id + "\""), "HTML should contain text div with correct id");
+            assertTrue(css().contains("#" + id), "CSS should reference same text id");
+        }
+
+        @Test
+        void testTextCssContainsPosition() {
+            SText text = SText.create(15, 25, "Pos");
+            draftman.visitText(text);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("top:25px"), "CSS should contain correct top");
+            assertTrue(cssOut.contains("left:15px"), "CSS should contain correct left");
+        }
+
+        @Test
+        void testTextCssContainsDefaultFontAttributes() {
+            SText text = SText.create(0, 0, "Font");
+            draftman.visitText(text);
+
+            String cssOut = css();
+            assertTrue(cssOut.contains("font-family:"), "CSS should contain font-family");
+            assertTrue(cssOut.contains("font-size:16px"), "CSS should contain default font size");
+            assertTrue(cssOut.contains("font-style:normal"), "CSS should contain normal font style");
+            assertTrue(cssOut.contains("font-weight:normal"), "CSS should contain normal font weight");
+        }
+
+        @Test
+        void testTextCssContainsColor() {
+            SText text = SText.create(0, 0, "Colored");
+            text.addAttributes(new ColorAttributes(true, false, Color.RED, Color.BLACK));
+            draftman.visitText(text);
+
+            assertTrue(css().contains("color:#ff0000"), "CSS should contain fill color as text color");
+        }
+
+        @Test
+        void testTextCssWhiteSpaceNowrap() {
+            SText text = SText.create(0, 0, "NoWrap");
+            draftman.visitText(text);
+
+            assertTrue(css().contains("white-space: nowrap"), "CSS should prevent text wrapping");
+        }
+
+        @Test
+        void testTextWithNullColorAttributesFallsBackToBlack() {
+            SText text = SText.create(0, 0, "Fallback");
+            text.addAttributes(new ColorAttributes(false, false, null, null));
+            draftman.visitText(text);
+
+            assertTrue(css().contains("color:#000000"), "Should fall back to black with null colors");
+        }
+    }
+
+    // ── visitCollection ─────────────────────────────────────────────
+
+    @Nested
+    class VisitCollectionTests {
+
+        @Test
+        void testEmptyCollection() {
+            SCollection empty = SCollection.of();
+            draftman.visitCollection(empty);
+
+            assertEquals("", html(), "Empty collection should produce no HTML");
+            assertEquals("", css(), "Empty collection should produce no CSS");
+        }
+
+        @Test
+        void testCollectionVisitsAllChildren() {
+            SCollection coll = SCollection.of(
+                    SRectangle.create(0, 0, 10, 10),
+                    SCircle.create(20, 20, 5)
+            );
+            draftman.visitCollection(coll);
+
+            assertTrue(html().contains("rec"), "Should visit rectangle");
+            assertTrue(html().contains("circle"), "Should visit circle");
+        }
+
+        @Test
+        void testNestedCollectionVisitsAllDescendants() {
+            SCollection inner = SCollection.of(
+                    SRectangle.create(0, 0, 5, 5)
+            );
+            SCollection outer = SCollection.of(
+                    inner,
+                    SCircle.create(10, 10, 3)
+            );
+            draftman.visitCollection(outer);
+
+            assertTrue(html().contains("rec"), "Should visit nested rectangle");
+            assertTrue(html().contains("circle"), "Should visit circle at outer level");
+        }
+    }
+
+    // ── generateHTML ────────────────────────────────────────────────
+
+    @Nested
+    class GenerateHTMLTests {
+
+        @Test
+        void testGenerateHTMLIncludesDoctype() {
+            SCollection model = SCollection.of();
+            draftman.generateHTML(model);
+
+            assertTrue(html().contains("<!DOCTYPE html>"), "Should include DOCTYPE");
+        }
+
+        @Test
+        void testGenerateHTMLIncludesHtmlStructure() {
+            SCollection model = SCollection.of();
+            draftman.generateHTML(model);
+
+            String htmlOut = html();
+            assertTrue(htmlOut.contains("<html"), "Should include html tag");
+            assertTrue(htmlOut.contains("<head>"), "Should include head tag");
+            assertTrue(htmlOut.contains("<body>"), "Should include body tag");
+            assertTrue(htmlOut.contains("</body>"), "Should close body tag");
+        }
+
+        @Test
+        void testGenerateHTMLReferencesStylesheet() {
+            SCollection model = SCollection.of();
+            draftman.generateHTML(model);
+
+            assertTrue(html().contains("style.css"), "Should reference CSS stylesheet");
+        }
+
+        @Test
+        void testGenerateHTMLIncludesShapeContent() {
+            SCollection model = SCollection.of(
+                    SRectangle.create(1, 2, 3, 4)
+            );
+            draftman.generateHTML(model);
+
+            assertTrue(html().contains("<div id=\"rec"), "Should include shape elements");
+        }
+    }
+}