diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file-1.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file-1.png
new file mode 100644
index 000000000..dec039be8
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file-1.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file.png
new file mode 100644
index 000000000..f09abdf90
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_dark.png
new file mode 100644
index 000000000..dec039be8
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn-1.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn-1.png
new file mode 100644
index 000000000..35db5c404
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn-1.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn.png
new file mode 100644
index 000000000..630d142af
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn_dark.png
new file mode 100644
index 000000000..35db5c404
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_class_test_file_url_path_fqn_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet-1.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet-1.png
new file mode 100644
index 000000000..0aa5f2472
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet-1.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet.png
new file mode 100644
index 000000000..c8c941f8c
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet_dark.png
new file mode 100644
index 000000000..139c666ad
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_code_snippet_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_diagram.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_diagram.png
new file mode 100644
index 000000000..36ae90f0d
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_diagram.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_diagram_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_diagram_dark.png
new file mode 100644
index 000000000..ec7f492ba
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_diagram_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_editor2.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_editor2.png
new file mode 100644
index 000000000..d8cd41d29
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_editor2.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_editor2_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_editor2_dark.png
new file mode 100644
index 000000000..86abed1ed
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_editor2_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable.png
index 2740256c7..e1dd6aab6 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable_dark.png
index 6aa840c07..4350f0448 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable_dark.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_acceptable_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct.png
index 45a8c52fc..4e4611dff 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct_dark.png
index dcdd4ac12..d56eebf82 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct_dark.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_1_correct_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable.png
index f08e10bd5..60ba174cd 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable_dark.png
index 7d8ef7c98..afc29fc21 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable_dark.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_acceptable_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct.png
index 5fe358218..564d73b30 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct_dark.png
index 76b55d6a8..0006bdff3 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct_dark.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_2_correct_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable.png
index 8bd077af8..d71bce13a 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable_dark.png
index 06d8689e8..a989aa502 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable_dark.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_acceptable_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct.png
index 172dc2265..dc57f2b22 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct_dark.png
index 8589da3b1..4c0a91f87 100644
Binary files a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct_dark.png and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_example_3_correct_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_standalone_text.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_standalone_text.png
new file mode 100644
index 000000000..6ce4f63b0
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_standalone_text.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_standalone_text_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_standalone_text_dark.png
new file mode 100644
index 000000000..749fb3851
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_standalone_text_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_table_cell.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_table_cell.png
new file mode 100644
index 000000000..13bd4111d
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_table_cell.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_table_cell_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_table_cell_dark.png
new file mode 100644
index 000000000..408e42eb0
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_table_cell_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_text_area.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_text_area.png
new file mode 100644
index 000000000..3311ecb0e
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_text_area.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_text_area_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_text_area_dark.png
new file mode 100644
index 000000000..71dbf368a
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_text_area_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_tree.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_tree.png
new file mode 100644
index 000000000..834580d4a
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_tree.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_tree_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_tree_dark.png
new file mode 100644
index 000000000..fcd1d3f3f
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_tree_dark.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn-1.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn-1.png
new file mode 100644
index 000000000..1cd3a823f
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn-1.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn.png
new file mode 100644
index 000000000..fbbb2c20b
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn.png differ
diff --git a/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn_dark.png b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn_dark.png
new file mode 100644
index 000000000..1cd3a823f
Binary files /dev/null and b/images/ui/dialog_and_popup_sizes/dialog_popup_sizes_url_path_fqn_dark.png differ
diff --git a/topics/Dialog-and-popup-sizes.md b/topics/Dialog-and-popup-sizes.md
index 0a58fdb0f..7f21e4cae 100644
--- a/topics/Dialog-and-popup-sizes.md
+++ b/topics/Dialog-and-popup-sizes.md
@@ -117,86 +117,95 @@ When the default sizes are either too big or too small for a window, or the wind
 
 1. Select how the content is displayed:
 
-    <table style="header-column">
+    <table style="none" border="false">
         <tr>
-            <td width="40%">
-                Table cell
+            <td width="50%">
+               <img src="dialog_popup_sizes_table_cell.png" alt="" width="378"/>
             </td>
             <td>
-                <p>Width: min&nbsp;65&nbsp;px</p>
-                <p>Height for the whole table: min&nbsp;120&nbsp;px</p>
-                <p>Follow guidelines for table width</p>
+               <p><format style="bold">Table cell</format></p>
+               <p>Width: min&nbsp;65&nbsp;px</p>
+               <p>Height for the whole table: min&nbsp;120&nbsp;px</p>
+               <p>Follow guidelines for table width</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                Tree
+            <td width="50%">
+                <img src="dialog_popup_sizes_tree.png" alt="" width="378"/>
             </td>
             <td>
-                Width: min 250&nbsp;px
+               <p><format style="bold">Tree</format></p>
+                <p>Width: min 250&nbsp;px</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                Text area
+            <td width="50%">
+                <img src="dialog_popup_sizes_text_area.png" alt="" width="378"/>
             </td>
             <td>
+                <p><format style="bold">Text area</format></p>
                 <p>Width: min&nbsp;270&nbsp;px, max&nbsp;600&nbsp;px</p>
                 <p>Height: min&nbsp;55&nbsp;px</p>
                 <p>For size and placement follow the <a href="text_area.md" anchor="size-and-placement">text area</a> guidelines</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                Diagram
+            <td width="50%">
+                <img src="dialog_popup_sizes_diagram.png" alt="" width="378"/>
             </td>
             <td>
-                A container with horizontal and vertical insets with 100&nbsp;px
+               <p><format style="bold">Diagram</format></p>
+                <p>A container with horizontal and vertical insets with 100&nbsp;px</p>
             </td>
         </tr>
     </table>
 
 2. What type of content is used:
 
-   <table style="header-column">
+   <table style="none" border="false">
         <tr>
-            <td width="40%">
-                Class/test/file name
+            <td width="50%">
+                <img src="dialog_popup_sizes_class_test_file.png" alt="" width="378"/>
             </td>
             <td>
+                <p><format style="bold">Class/test/file name</format></p>
                 <p>Width: min&nbsp;250&nbsp;px</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                URL/Path/FQN for class
+            <td width="50%">
+                <img src="dialog_popup_sizes_url_path_fqn.png" alt="" width="378"/>
             </td>
             <td>
+                <p><format style="bold">URL/Path/FQN for class</format></p>
                 <p>Width: min&nbsp;350&nbsp;px</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                Class/test/file name + URL/Path/FQN for class
+            <td width="50%">
+                <img src="dialog_popup_sizes_class_test_file_url_path_fqn.png" alt="" width="378"/>
             </td>
             <td>
+                <p><format style="bold">Class/test/file name + URL/Path/FQN for class</format></p>
                 <p>Width: min&nbsp;400&nbsp;px</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                Code snippet or editor
+            <td width="50%">
+                <img src="dialog_popup_sizes_code_snippet.png" alt="" width="378"/>
             </td>
             <td>
+                <p><format style="bold">Code snippet or editor</format></p>
                 <p>Width: min&nbsp;400&nbsp;px</p>
                 <p>Height (when multiple lines): min&nbsp;120&nbsp;px</p>
             </td>
         </tr>
         <tr>
-            <td width="40%">
-                Standalone text
+            <td width="50%">
+                <img src="dialog_popup_sizes_standalone_text.png" alt="" width="378"/>
             </td>
             <td>
+                <p><format style="bold">Standalone text</format></p>
                 <p>Width: min&nbsp;300&nbsp;px</p>
                 <p>Height (when multiple lines): min&nbsp;120&nbsp;px</p>
             </td>