diff --git a/Documentation/Browser/AddNewIDLFile.md b/Documentation/Browser/AddNewIDLFile.md
new file mode 100644
index 0000000000..6f9ac6318a
--- /dev/null
+++ b/Documentation/Browser/AddNewIDLFile.md
@@ -0,0 +1,31 @@
+# Adding a new IDL file
+
+Serenity's build system does a lot of work of turning the IDL from a Web spec into code, but there are a few things you'll need to do yourself.
+
+For the sake of example, let's say you're wanting to add the `HTMLDetailsElement`.
+
+1. Create `LibWeb/HTML/HTMLDetailsElement.idl` with the contents of the IDL section of the spec. In this case, that would be:
+```webidl
+[Exposed=Window]
+interface HTMLDetailsElement : HTMLElement {
+    [HTMLConstructor] constructor();
+
+    [CEReactions] attribute boolean open;
+};
+```
+
+2. If the IDL starts with `[Exposed=Window]`, remove that line from the .idl file, and add the following to [`LibWeb/Bindings/WindowObjectHelper.h`](../../Userland/Libraries/LibWeb/Bindings/WindowObjectHelper.h):
+    - `#include <LibWeb/Bindings/HTMLDetailsElementConstructor.h>` and
+    - `#include <LibWeb/Bindings/HTMLDetailsElementPrototype.h>` to the includes list.
+    - `ADD_WINDOW_OBJECT_INTERFACE(HTMLDetailsElement)      \` to the macro at the bottom.
+
+3. Add a `libweb_js_wrapper()` call to [`LibWeb/CMakeLists.txt`](../../Userland/Libraries/LibWeb/CMakeLists.txt)
+
+4. Forward declare the generated classes in [`LibWeb/Forward.h`](../../Userland/Libraries/LibWeb/Forward.h):
+    - `HTMLDetailsElement` in its namespace.
+    - `HTMLDetailsElementWrapper` in the `Web::Bindings` namespace.
+
+5. If your interface is an Event type:
+    - Add `#import <DOM/Event.idl>` at the top of the IDL file.
+    - Open [`LibWeb/Bindings/EventWrapperFactory.cpp`](../../Userland/Libraries/LibWeb/Bindings/EventWrapperFactory.cpp) and add an `#include` directive and `if` statement for your new Event type.
+