diff --git a/src/file/checkbox/checkbox-symbol.ts b/src/file/checkbox/checkbox-symbol.ts
new file mode 100644
index 0000000000..7e172c3141
--- /dev/null
+++ b/src/file/checkbox/checkbox-symbol.ts
@@ -0,0 +1,29 @@
+// This represents element type CT_SdtCheckboxSymbol element
+//
+//
+//
+//
+
+import { XmlAttributeComponent, XmlComponent } from "@file/xml-components";
+import { shortHexNumber } from "@util/values";
+
+class CheckboxSymbolAttributes extends XmlAttributeComponent<{
+ readonly val?: string | number | boolean;
+ readonly symbolfont?: string;
+}> {
+ protected readonly xmlKeys = {
+ val: "w14:val",
+ symbolfont: "w14:font",
+ };
+}
+
+export class CheckBoxSymbolElement extends XmlComponent {
+ public constructor(name: string, val: string, font?: string) {
+ super(name);
+ if (font) {
+ this.root.push(new CheckboxSymbolAttributes({ val: shortHexNumber(val), symbolfont: font }));
+ } else {
+ this.root.push(new CheckboxSymbolAttributes({ val }));
+ }
+ }
+}
diff --git a/src/file/checkbox/checkbox-util.ts b/src/file/checkbox/checkbox-util.ts
new file mode 100644
index 0000000000..a3732c282e
--- /dev/null
+++ b/src/file/checkbox/checkbox-util.ts
@@ -0,0 +1,44 @@
+//
+//
+//
+//
+//
+//
+//
+//
+
+import { XmlComponent } from "@file/xml-components";
+import { CheckBoxSymbolElement } from "@file/checkbox/checkbox-symbol";
+
+export interface ICheckboxSymbolProperties {
+ readonly value?: string;
+ readonly font?: string;
+}
+
+export interface ICheckboxSymbolOptions {
+ readonly checked?: boolean;
+ readonly checkedState?: ICheckboxSymbolProperties;
+ readonly uncheckedState?: ICheckboxSymbolProperties;
+}
+
+export class CheckBoxUtil extends XmlComponent {
+ private readonly DEFAULT_UNCHECKED_SYMBOL: string = "2610";
+ private readonly DEFAULT_CHECKED_SYMBOL: string = "2612";
+ private readonly DEFAULT_FONT: string = "MS Gothic";
+ public constructor(options?: ICheckboxSymbolOptions) {
+ super("w14:checkbox");
+
+ const value = options?.checked ? "1" : "0";
+ let symbol: string;
+ let font: string;
+ this.root.push(new CheckBoxSymbolElement("w14:checked", value));
+
+ symbol = options?.checkedState?.value ? options?.checkedState?.value : this.DEFAULT_CHECKED_SYMBOL;
+ font = options?.checkedState?.font ? options?.checkedState?.font : this.DEFAULT_FONT;
+ this.root.push(new CheckBoxSymbolElement("w14:checkedState", symbol, font));
+
+ symbol = options?.uncheckedState?.value ? options?.uncheckedState?.value : this.DEFAULT_UNCHECKED_SYMBOL;
+ font = options?.uncheckedState?.font ? options?.uncheckedState?.font : this.DEFAULT_FONT;
+ this.root.push(new CheckBoxSymbolElement("w14:uncheckedState", symbol, font));
+ }
+}
diff --git a/src/file/checkbox/checkbox.ts b/src/file/checkbox/checkbox.ts
new file mode 100644
index 0000000000..9f8b55e4f2
--- /dev/null
+++ b/src/file/checkbox/checkbox.ts
@@ -0,0 +1,45 @@
+import { SymbolRun } from "@file/paragraph/run/symbol-run";
+import { StructuredDocumentTagProperties } from "@file/table-of-contents/sdt-properties";
+import { StructuredDocumentTagContent } from "@file/table-of-contents/sdt-content";
+import { XmlComponent } from "@file/xml-components";
+import { CheckBoxUtil, ICheckboxSymbolOptions } from "./checkbox-util";
+
+export class CheckBox extends XmlComponent {
+ // default values per Microsoft
+ private readonly DEFAULT_UNCHECKED_SYMBOL: string = "2610";
+ private readonly DEFAULT_CHECKED_SYMBOL: string = "2612";
+ private readonly DEFAULT_FONT: string = "MS Gothic";
+ public constructor(options?: ICheckboxSymbolOptions) {
+ super("w:sdt");
+
+ this.root.push(
+ new StructuredDocumentTagProperties(undefined, {
+ children: [new CheckBoxUtil(options)],
+ }),
+ );
+
+ const content = new StructuredDocumentTagContent();
+ const checkedFont: string | undefined = options?.checkedState?.font;
+ const checkedText: string | undefined = options?.checkedState?.value;
+ const uncheckedFont: string | undefined = options?.uncheckedState?.font;
+ const uncheckedText: string | undefined = options?.uncheckedState?.value;
+ let symbolFont: string;
+ let char: string;
+
+ if (options?.checked) {
+ symbolFont = checkedFont ? checkedFont : this.DEFAULT_FONT;
+ char = checkedText ? checkedText : this.DEFAULT_CHECKED_SYMBOL;
+ } else {
+ symbolFont = uncheckedFont ? uncheckedFont : this.DEFAULT_FONT;
+ char = uncheckedText ? uncheckedText : this.DEFAULT_UNCHECKED_SYMBOL;
+ }
+
+ const initialRenderedChar = new SymbolRun({
+ char: char,
+ symbolfont: symbolFont,
+ });
+
+ content.addChildElement(initialRenderedChar);
+ this.root.push(content);
+ }
+}