A type-safe, composable DSL for building HTML pages in OCaml.

• Type-safe: Build HTML using OCaml's type system
• Composable: Combine elements easily with functional composition
• Safe: Automatic HTML escaping to prevent XSS attacks
• Complete: Support for all common HTML elements and attributes
• Template system: Create reusable templates for dynamic content
• Well-tested: Comprehensive test suite covering all features

opam install cathmtl

Or from source:

git clone https://github.com/claeusdev/cathtml.git
cd cathtml
dune build
dune install

dune build

dune runtest

dune exec cathmtl

This project uses ocamlformat for consistent code style. Format code with:

dune build @fmt --auto-promote

Or using ocamlformat directly:

ocamlformat --inplace lib/*.ml bin/*.ml test/*.ml

open Cathmtl.Html

let page = html [] [
  head [] [
    title [] [text "My Page"]
  ];
  body [] [
    h1 [] [text "Hello, World!"];
    p [] [text "This is a paragraph."]
  ]
]

let html_string = to_string page

let div_with_class = div [class_name "container"; id "main"] [
  p [] [text "Content here"]
]

let image = img [attr "src" "photo.jpg"; attr "alt" "Photo"] []

let user_card = template (fun (name, email) ->
  div [class_name "card"] [
    h2 [] [text name];
    p [] [text email]
  ]
)

let card_html = apply_template user_card ("Alice", "[email protected]")

• text s - Create text content
• element tag attrs children - Create an HTML element (low-level)
• create_element tag attrs children - Helper to create an element with tag name and attributes
• to_string html / render html - Convert HTML content to string representation

All common HTML elements are available:

• Document structure: html, head, body, title, meta
• Headings: h1, h2, h3, h4, h5, h6
• Text elements: p, div, span, strong, em, code, pre
• Lists: ul, ol, li
• Links and media: a, img
• Forms: form, input, textarea, button, label, select, option
• Tables: table, thead, tbody, tr, th, td
• Semantic elements: header, nav, main, section, article, aside, footer

• class_name name - Create a class attribute
• id name - Create an id attribute
• style css - Create a style attribute
• data key value - Create a data attribute
• attr name value - Create a custom attribute

• self_closing tag attrs - Create a self-closing element (like img, input, etc.)
• comment text - Create an HTML comment node
• doctype type_str - Create a DOCTYPE declaration

• is_empty html - Check if content is empty
• attributes html - Get attributes from an element (returns Some attrs or None)
• children html - Get children from an element (returns Some children or None)
• escape_html s - Escape HTML special characters in text content
• escape_attr s - Escape special characters in attribute values

See bin/main.ml for more comprehensive examples including:

• Blog post templates
• Contact forms
• Data tables

open Cathmtl.Html

let page = html [] [
  head [] [
    title [] [text "My Page"];
    meta [attr "charset" "UTF-8"] []
  ];
  body [] [
    header [] [
      h1 [] [text "Welcome"];
      nav [] [
        a [attr "href" "/"] [text "Home"];
        text " | ";
        a [attr "href" "/about"] [text "About"]
      ]
    ];
    main [] [
      section [] [
        h2 [] [text "Features"];
        ul [] [
          li [] [text "Type-safe HTML generation"];
          li [] [text "Automatic escaping"];
          li [] [text "Composable API"]
        ]
      ]
    ];
    footer [] [
      p [] [text "© 2024"]
    ]
  ]
]

let () = print_endline (to_string page)

cathmtl/
├── lib/           # Library source code
│   └── html.ml    # Main HTML DSL implementation
├── bin/           # Executable examples
│   └── main.ml    # Demo application
├── test/          # Test suite
│   └── test_cathmtl.ml
├── dune-project   # Dune project configuration
├── .ocamlformat   # Code formatting configuration
└── README.md      # This file

The project includes a comprehensive test suite covering:

• Text and element rendering
• Nested structures
• Attributes and escaping
• Self-closing elements
• DOCTYPE and comments
• Template system
• Complex page structures

Run the test suite:

dune runtest

Contributions are welcome! Please ensure:

• Code is formatted with ocamlformat
• Tests pass (dune runtest)
• New features include tests

See LICENSE file for details.

Nana Adjei Manu ([email protected])

• GitHub: https://github.com/claeusdev/cathtml
• Documentation: https://github.com/claeusdev/cathtml