<html>
	<head>
		<style>div.row { 
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		border: solid 1px black;
		margin-top: 1rem;
	}
div.section {
	flex: auto;
	border: solid 1px #ccc;
	padding: 1rem;
}
div.section div.icon {									
	margin-top: .5rem;
}
div.section div.icon img {
	margin-right: 1rem;
	/* border: solid 1px #000000cc; */
	vertical-align: middle;
}
div.section div.icon.missing {
	/* background-color: #ff000033; */
	color: red;
}									
div.section div.icon > span.image {
	display: inline-block;
	margin-right: 1rem;
	text-align: center;
}
div.section div.icon > span.image.missing {
	background-color: #ffffffcc;
	color: red;
	border: solid 1px red;
}
div.section div.icon figcaption {
	display: inline;
}
span.debug {
	color: #aaa;
}div.section div.icon.png:not(.svg) figcaption {
	color: #c00;
}	</style>
	<script>
		function changeBackground(fg,bg) {
   	   	   document.body.style.background = bg;
   	   	   document.body.style.color = fg;
		}
	</script>								
</head>
<body><h2>All SVG and PNG icons</h2><div style="background-color: white; color: black; padding: 1rem; margin: 1rem;">
	<strong>Background color:</strong> 
	<a href="#" onclick="changeBackground('black','transparent');">None</a> | 
	<a href="#" onclick="changeBackground('black','red');">Red</a> | 
	<a href="#" onclick="changeBackground('black','green');">Green</a> | 
	<a href="#" onclick="changeBackground('black','white');">White</a> | 
	<a href="#" onclick="changeBackground('white','black');">Black</a> | 
	<a href="#" onclick="changeBackground('black','grey');">Grey</a>
</div><div><div></div></div>
<div class="row">
<div class="section" data-section-name="toolbar">
	<div class="icon svg png"><img src="mini/1/1.svg" style="width: 10" title="svg (1,1) "/><img src="mini/1/1.png" title="png (1,1) "/><figcaption>toolbar_close <span class="debug">(1,1)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/2.svg" style="width: 10" title="svg (1,2) "/><img src="mini/1/2.png" title="png (1,2) "/><figcaption>toolbar_minimize <span class="debug">(1,2)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/3.svg" style="width: 10" title="svg (1,3) "/><img src="mini/1/3.png" title="png (1,3) "/><figcaption>toolbar_maximize <span class="debug">(1,3)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/4.svg" style="width: 10" title="svg (1,4) "/><img src="mini/1/4.png" title="png (1,4) "/><figcaption>toolbar_restore <span class="debug">(1,4)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/5.svg" style="width: 10" title="svg (1,5) "/><img src="mini/1/5.png" title="png (1,5) "/><figcaption>toolbar_pinned <span class="debug">(1,5)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/6.svg" style="width: 10" title="svg (1,6) "/><img src="mini/1/6.png" title="png (1,6) "/><figcaption>toolbar_unpinned <span class="debug">(1,6)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/7.svg" style="width: 10" title="svg (1,7) "/><img src="mini/1/7.png" title="png (1,7) "/><figcaption>toolbar_expand <span class="debug">(1,7)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/8.svg" style="width: 10" title="svg (1,8) "/><img src="mini/1/8.png" title="png (1,8) "/><figcaption>toolbar_dropdown <span class="debug">(1,8)</span></figcaption></div>
</div><div class="section sub" data-section-name="sort">	<div class="icon svg png"><img src="mini/1/9.svg" style="width: 10" title="svg (1,9) "/><img src="mini/1/9.png" title="png (1,9) "/><figcaption>sort_accending <span class="debug">(1,9)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/10.svg" style="width: 10" title="svg (1,10) "/><img src="mini/1/10.png" title="png (1,10) "/><figcaption>sort_descending <span class="debug">(1,10)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/1/11.svg" style="width: 10" title="svg (1,11) "/><img src="mini/1/11.png" title="png (1,11) "/><figcaption>sort_group <span class="debug">(1,11)</span></figcaption></div>
</div></div>
<div class="row">
<div class="section" data-section-name="general">
	<div class="icon svg"><img src="mini/2/1.svg" style="width: 10" title="svg (2,1) "/><span class="image missing" style="min-width: 10; min-height: 10">?</span><figcaption>general_blank <span class="debug">(2,1)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/2.svg" style="width: 10" title="svg (2,2) "/><img src="mini/2/2.png" title="png (2,2) "/><figcaption>general_save <span class="debug">(2,2)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/3.svg" style="width: 10" title="svg (2,3) "/><img src="mini/2/3.png" title="png (2,3) "/><figcaption>general_add <span class="debug">(2,3)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/4.svg" style="width: 10" title="svg (2,4) "/><img src="mini/2/4.png" title="png (2,4) "/><figcaption>general_edit <span class="debug">(2,4)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/5.svg" style="width: 10" title="svg (2,5) "/><img src="mini/2/5.png" title="png (2,5) "/><figcaption>general_delete <span class="debug">(2,5)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/6.svg" style="width: 10" title="svg (2,6) "/><img src="mini/2/6.png" title="png (2,6) "/><figcaption>general_copy <span class="debug">(2,6)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/7.svg" style="width: 10" title="svg (2,7) "/><img src="mini/2/7.png" title="png (2,7) "/><figcaption>general_search <span class="debug">(2,7)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/8.svg" style="width: 10" title="svg (2,8) "/><img src="mini/2/8.png" title="png (2,8) "/><figcaption>general_previous <span class="debug">(2,8)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/9.svg" style="width: 10" title="svg (2,9) "/><img src="mini/2/9.png" title="png (2,9) "/><figcaption>general_next <span class="debug">(2,9)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/10.svg" style="width: 10" title="svg (2,10) "/><img src="mini/2/10.png" title="png (2,10) "/><figcaption>general_up <span class="debug">(2,10)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/11.svg" style="width: 10" title="svg (2,11) "/><img src="mini/2/11.png" title="png (2,11) "/><figcaption>general_down <span class="debug">(2,11)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/2/12.svg" style="width: 10" title="svg (2,12) "/><img src="mini/2/12.png" title="png (2,12) "/><figcaption>general_toogle <span class="debug">(2,12)</span></figcaption></div>
</div></div>
<div class="row">
<div class="section" data-section-name="debugger">
	<div class="icon svg png"><img src="mini/3/1.svg" style="width: 10" title="svg (3,1) "/><img src="mini/3/1.png" title="png (3,1) "/><figcaption>debugger_callstack_depth <span class="debug">(3,1)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/2.svg" style="width: 10" title="svg (3,2) "/><img src="mini/3/2.png" title="png (3,2) "/><figcaption>debugger_error <span class="debug">(3,2)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/3.svg" style="width: 10" title="svg (3,3) "/><img src="mini/3/3.png" title="png (3,3) "/><figcaption>debugger_expand_info <span class="debug">(3,3)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/4.svg" style="width: 10" title="svg (3,4) "/><img src="mini/3/4.png" title="png (3,4) "/><figcaption>debugger_set_sizes <span class="debug">(3,4)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/5.svg" style="width: 10" title="svg (3,5) "/><img src="mini/3/5.png" title="png (3,5) "/><figcaption>debugger_show_hex_value <span class="debug">(3,5)</span></figcaption></div>
</div><div class="section sub" data-section-name="breakpoints">	<div class="icon svg png"><img src="mini/3/6.svg" style="width: 10" title="svg (3,6) "/><img src="mini/3/6.png" title="png (3,6) "/><figcaption>breakpoints_enable <span class="debug">(3,6)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/7.svg" style="width: 10" title="svg (3,7) "/><img src="mini/3/7.png" title="png (3,7) "/><figcaption>breakpoints_disable <span class="debug">(3,7)</span></figcaption></div>
</div><div class="section sub" data-section-name="viewer">	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/3/8.png" title="png (3,8) "/><figcaption>viewer_wrap <span class="debug">(3,8)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/3/9.png" title="png (3,9) "/><figcaption>viewer_expand <span class="debug">(3,9)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/10.svg" style="width: 10" title="svg (3,10) "/><img src="mini/3/10.png" title="png (3,10) "/><figcaption>viewer_lock <span class="debug">(3,10)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/3/11.svg" style="width: 10" title="svg (3,11) "/><img src="mini/3/11.png" title="png (3,11) "/><figcaption>viewer_formatting <span class="debug">(3,11)</span></figcaption></div>
</div><div class="section sub" data-section-name="watch">	<div class="icon svg png"><img src="mini/3/12.svg" style="width: 10" title="svg (3,12) "/><img src="mini/3/12.png" title="png (3,12) "/><figcaption>watch_auto <span class="debug">(3,12)</span></figcaption></div>
</div><div class="section sub" data-section-name="callstack">	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/1.png" title="png (4,1) "/><figcaption>callstack_send_to_external_editor <span class="debug">(4,1)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/2.png" title="png (4,2) "/><figcaption>callstack_is_melted <span class="debug">(4,2)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/3.png" title="png (4,3) "/><figcaption>callstack_has_rescue <span class="debug">(4,3)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/4/4.svg" style="width: 10" title="svg (4,4) "/><img src="mini/4/4.png" title="png (4,4) "/><figcaption>callstack_is_non_object_call <span class="debug">(4,4)</span></figcaption></div>
</div><div class="section sub" data-section-name="execution">	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/5.png" title="png (4,5) "/><figcaption>execution_record <span class="debug">(4,5)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/6.png" title="png (4,6) "/><figcaption>execution_replay <span class="debug">(4,6)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/7.png" title="png (4,7) "/><figcaption>execution_object_storage <span class="debug">(4,7)</span></figcaption></div>
</div><div class="section sub" data-section-name="hidden">	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/8.png" title="png (4,8) "/><figcaption>hidden_show_in_callstack <span class="debug">(4,8)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/9.png" title="png (4,9) "/><figcaption>hidden_hide_in_callstack <span class="debug">(4,9)</span></figcaption></div>
</div><div class="section sub" data-section-name="reserved">	<div class="icon missing"><span class="image missing" style="min-width: 10; min-height: 10">?</span><span class="image missing" style="min-width: 10; min-height: 10">?</span><figcaption>reserved_reserved_1 <span class="debug">(4,10)</span></figcaption></div>
</div><div class="section sub" data-section-name="evaluation">	<div class="icon svg png"><img src="mini/4/11.svg" style="width: 10" title="svg (4,11) "/><img src="mini/4/11.png" title="png (4,11) "/><figcaption>evaluation_refresh <span class="debug">(4,11)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/4/12.png" title="png (4,12) "/><figcaption>evaluation_unused_icon <span class="debug">(4,12)</span></figcaption></div>
</div></div>
<div class="row">
<div class="section" data-section-name="new">
	<div class="icon svg png"><img src="mini/5/1.svg" style="width: 10" title="svg (5,1) "/><img src="mini/5/1.png" title="png (5,1) "/><figcaption>new_feature <span class="debug">(5,1)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/5/2.svg" style="width: 10" title="svg (5,2) "/><img src="mini/5/2.png" title="png (5,2) "/><figcaption>new_class <span class="debug">(5,2)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/5/3.svg" style="width: 10" title="svg (5,3) "/><img src="mini/5/3.png" title="png (5,3) "/><figcaption>new_cluster <span class="debug">(5,3)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/5/4.png" title="png (5,4) "/><figcaption>new_expression <span class="debug">(5,4)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/5/5.svg" style="width: 10" title="svg (5,5) "/><img src="mini/5/5.png" title="png (5,5) "/><figcaption>new_library <span class="debug">(5,5)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/5/6.png" title="png (5,6) "/><figcaption>new_assembly <span class="debug">(5,6)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/5/7.png" title="png (5,7) "/><figcaption>new_watch_tool <span class="debug">(5,7)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/5/8.png" title="png (5,8) "/><figcaption>new_window <span class="debug">(5,8)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/5/9.png" title="png (5,9) "/><figcaption>new_tool_edition <span class="debug">(5,9)</span></figcaption></div>
</div></div>
<div class="row">
<div class="section" data-section-name="completion">
	<div class="icon svg png"><img src="mini/6/1.svg" style="width: 10" title="svg (6,1) "/><img src="mini/6/1.png" title="png (6,1) "/><figcaption>completion_remember_size <span class="debug">(6,1)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/2.svg" style="width: 10" title="svg (6,2) "/><img src="mini/6/2.png" title="png (6,2) "/><figcaption>completion_filter <span class="debug">(6,2)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/3.svg" style="width: 10" title="svg (6,3) "/><img src="mini/6/3.png" title="png (6,3) "/><figcaption>completion_show_disambiguants <span class="debug">(6,3)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/4.svg" style="width: 10" title="svg (6,4) "/><img src="mini/6/4.png" title="png (6,4) "/><figcaption>completion_show_signature <span class="debug">(6,4)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/5.svg" style="width: 10" title="svg (6,5) "/><img src="mini/6/5.png" title="png (6,5) "/><figcaption>completion_show_alias <span class="debug">(6,5)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/6.svg" style="width: 10" title="svg (6,6) "/><img src="mini/6/6.png" title="png (6,6) "/><figcaption>completion_show_return_type <span class="debug">(6,6)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/7.svg" style="width: 10" title="svg (6,7) "/><img src="mini/6/7.png" title="png (6,7) "/><figcaption>completion_show_assigner <span class="debug">(6,7)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/8.svg" style="width: 10" title="svg (6,8) "/><img src="mini/6/8.png" title="png (6,8) "/><figcaption>completion_show_obsolete <span class="debug">(6,8)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/9.svg" style="width: 10" title="svg (6,9) "/><img src="mini/6/9.png" title="png (6,9) "/><figcaption>completion_show_target_class <span class="debug">(6,9)</span></figcaption></div>
	<div class="icon svg png"><img src="mini/6/10.svg" style="width: 10" title="svg (6,10) "/><img src="mini/6/10.png" title="png (6,10) "/><figcaption>completion_show_unicode_symbol <span class="debug">(6,10)</span></figcaption></div>
</div></div>
<div class="row">
<div class="section" data-section-name="bon">
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/7/1.png" title="png (7,1) "/><figcaption>bon_persistent <span class="debug">(7,1)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/7/2.png" title="png (7,2) "/><figcaption>bon_interfaces <span class="debug">(7,2)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/7/3.png" title="png (7,3) "/><figcaption>bon_effective <span class="debug">(7,3)</span></figcaption></div>
	<div class="icon png"><span class="image missing" style="min-width: 10; min-height: 10">?</span><img src="mini/7/4.png" title="png (7,4) "/><figcaption>bon_deferred <span class="debug">(7,4)</span></figcaption></div>
</div>
	</body>
</html>