Bracketry is a free JavaScript library that can visualize tournament brackets (or "draws") in any kind of sport:
Bracketry requires very little JS code on your side.
Its look and behaviour can be easily adjusted by a vast range of options.
Its layout is flexible and mobile-friendly.
It uses screen space sparingly, showing as much content as possible.
Free to use, MIT-licensed.
49kb minified, 12 gzipped.
npm install bracketry
import { createBracket } from 'bracketry'
const wrapper = document.querySelector('#your-wrapper-element')
const data = { ... } // data of a specific shape
createBracket(data, wrapper)