Hugging Face's logo

Spaces:
shethjenil
/
netron
Running

App Files Community
netron / index.html
shethjenil's picture
shethjenil
Upload 30 files
bbd203b verified
raw
history blame contribute delete
38.4 kB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Visualizer for neural network, deep learning and machine learning models." />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
<meta http-equiv="Content-Security-Policy" content="script-src 'self'">
<meta name="version" content="8.9.4">
<meta name="date" content="2026-03-09 04:38:04">
<title>Netron</title>
<link rel="stylesheet" type="text/css" href="grapher.css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<link rel="icon" type="image/png" href="icon.png">
<link rel="apple-touch-icon" type="image/png" href="icon.png">
<link rel="apple-touch-icon-precomposed" type="image/png" href="icon.png">
<link rel="fluid-icon" type="image/png" href="icon.png">
<script type="text/javascript" src="index.js"></script>
<style>
html { touch-action: none; overflow: hidden; width: 100%; height: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; -webkit-text-rendering: optimizeLegibility; -moz-text-rendering: optimizeLegibility; -ms-text-rendering: optimizeLegibility; -o-text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; }
body { touch-action: none; overflow: hidden; width: 100%; height: 100%; margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "Ubuntu", "Droid Sans", sans-serif, "PingFang SC"; font-size: 12px; text-rendering: geometricPrecision; }
button { font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "Ubuntu", "Droid Sans", sans-serif, "PingFang SC"; }
.center { position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.select { user-select: text; -webkit-user-select: text; -moz-user-select: text; }
.target { display: flex; height: 100%; width: 100%; overflow: auto; outline: none; touch-action: pan-x pan-y; }
.canvas { margin: auto; flex-shrink: 0; text-rendering: geometricPrecision; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.open-file-dialog { display: none; }
.default { background-color: #ffffff; }
.default .logo { display: none; }
.default .target { display: flex; opacity: 1; }
.default .toolbar { display: flex; }
.toolbar { display: flex; align-items: center; position: absolute; bottom: 10px; left: 10px; padding: 0; margin: 0; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.toolbar button:focus { outline: 0; }
.toolbar-button { background: None; border-radius: 6px; border: 0; margin: 0; margin-right: 1px; padding: 0; fill: None; stroke: #777; cursor: pointer; width: 32px; height: 32px; user-select: none; }
.toolbar-path { display: flex; align-items: center; }
.toolbar-select { background: transparent; position: relative; width: 170px; margin: 4px 4px 4px 4px; }
.toolbar-select select { width: 100%; appearance: none; -webkit-appearance: none; -moz-appearance: none; font-family: inherit; font-size: 12px; line-height: 16px; border: 1px solid; padding: 3px 18px 3px 10px; border-radius: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box; }
.toolbar-select select { background: #777; border-color: #777; color: #fff; }
.toolbar-select-arrow { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); pointer-events: none; }
.toolbar-select-arrow { fill: #ffffff; }
.toolbar-select select:hover { background: #000000; border-color: #000000; }
.toolbar-select select:focus { outline: 0; }
.toolbar-path-back-button { background: #777; border-top-left-radius: 6px; border-bottom-left-radius: 6px; border: 1px solid; border-color: #777; margin: 4px 0px 4px 4px; padding: 5px 8px 5px 8px; cursor: pointer; color: #ffffff; font-size: 12px; line-height: 12px; transition: 0.1s; }
.toolbar-path-back-button:hover { background: #000000; border-color: #000000; }
.toolbar-path-name-button { background: #777; border: 0px; border-color: #777; color: #ffffff; border-left: 1px; border-left-color: #ffffff; margin: 4px 0 4px 1px; padding: 6px 8px 6px 8px; cursor: pointer; width: auto; font-size: 12px; line-height: 12px; transition: 0.1s; }
.toolbar-path-name-button:hover { background: #000000; border-color: #000000; }
.toolbar-path-name-button:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; }
.toolbar-icon .border { stroke: #fff; }
.toolbar-icon .stroke { stroke: #808080; }
.toolbar-icon .fill { fill: #808080; }
.toolbar-icon:hover .stroke { stroke: #000000; }
.toolbar-icon:hover .fill { fill: #000000; }
.message { display: none; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; flex-direction: column; justify-content: flex-start; }
.message-text { display: inline; text-align: center; width: 562px; font-size: 13px; line-height: 20px; margin-top: 50vh; padding-top: 56px; padding-bottom: 20px; margin-left: auto; margin-right: auto; user-select: text; -webkit-user-select: text; -moz-user-select: text; }
.welcome .message-text a { text-decoration: none; color: #666666; }
.welcome .message-text a:visited { color: inherit; }
.welcome .message-text a:hover { color: #242424; text-decoration: underline; }
.message-button { display: inline; text-align: center; width: 125px; margin-left: auto; margin-right: auto; }
.logo-text { top: -57px; width: 582px; transition: 0.1s; }
.logo-name { top: -170px; width: 582px; transition: 0.1s; }
.logo-icon { left: 248px; top: -18px; width: 106px; height: 106px; transition: 0.1s; }
.logo-spinner { left: 248px; top: -18px; width: 106px; height: 106px; display: none; }
.logo-stroke { stroke: #444444; }
.logo-fill { fill: #444444; }
.logo-border { stroke: #555555; }
.logo-glyph { fill: #444444; }
.logo-button { font-size: 12px; font-weight: bold; line-height: 1.25; text-align: center; vertical-align: middle; min-width: 5em; height: 2.7em; border-radius: 1.3em; transition: 0.1s; user-select: none; -webkit-user-select: none; -moz-user-select: none; color: #444444; background-color: #ececec; border: 1px solid #444444; }
.logo-button:hover { color: #ececec; background-color: #444444; cursor: pointer; transition: 0.2s; }
.logo-button:focus { outline: 0; }
.logo-message { display: none; height: 0px; }
.logo-github { display: none; }
.open-file-button { top: 170px; left: 0px; width: 10.5em; }
.progress { top: 120px; height: 2px; width: 400px; }
.progress-bar { height: 100%; width: 0%; background-color: #444444; }
.notification .logo-name { display: none; }
.notification .open-file-button { display: none; }
.notification .progress { display: none; }
.welcome body { background-color: #ececec; }
.welcome { background-color: #ececec; color: #242424; }
.welcome .message-text { display: none; opacity: 0; }
.welcome .message-button { display: none; opacity: 0; }
.welcome .target { display: none; opacity: 0; }
.welcome .menu { background-color: #ffffff; }
.welcome.spinner .logo-spinner { display: block; -webkit-animation: orbit 0.5s infinite linear; animation: orbit 0.5s infinite linear; cursor: wait; }
.welcome.spinner .menu-button { display: none; }
.welcome.notification .menu-button { display: none; }
.notification body { background-color: #ececec; }
.notification .message { display: flex; opacity: 1; }
.notification .message-text { display: inline; opacity: 1; }
.notification .message-button { display: inline; opacity: 1; }
.alert { background-color: #ececec; color: #242424; }
.alert .target { display: none; opacity: 0; }
.alert .toolbar { display: none; opacity: 0; }
.alert .menu { display: none; opacity: 0; }
.alert .logo { display: none; opacity: 0; }
.alert .message { display: flex; opacity: 1; }
.alert .message-text { display: inline; opacity: 1; width: 50%; padding-top: 0px; }
.alert .message-button { display: inline; opacity: 1; }
.about { overflow: hidden; }
.about .toolbar { display: none; }
.about .logo { display: block; background-color: #ececec; color: #666666; }
.about .logo-message { display: block; top: 132px; font-size: 14px; }
.about .logo-github { display: block; top: 340px; width: 48px; height: 48px; }
.about a { text-decoration: none; color: #666666; }
.about a:visited { color: inherit; }
.about a:hover { color: #242424; }
.about .open-file-button { display: none; }
.about .logo-name { display: none; }
.about .notification { display: none; }
.about .progress { display: none; }
.about .menu-button { display: none; }
.titlebar { color: #aaaaaa; display: none; height: 32px; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; -webkit-app-region: drag; }
.titlebar-visible { display: block; }
.titlebar-content { display: block; padding: 0 142px; height: 100%; text-align: center; font-size: 14px; line-height: 32px; transition: all .1s ease-in-out; user-select: none; }
.titlebar-content-text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spinner .titlebar-content { opacity: 0; }
.active .titlebar { color: #464646; transition: all 0.05s ease-in-out; }
.titlebar-control-box { display: none; align-items: center; flex-direction: row-reverse; height: 100%; position: absolute; top: 0; right: 0; width: 138px; }
.titlebar-control-box-visible { display: flex; }
.titlebar-icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentColor; overflow: hidden; }
.titlebar-button { display: flex; justify-content: center; align-items: center; width: 46px; height: 32px; user-select: none; -webkit-app-region: no-drag; }
.titlebar-button:hover { color: #000000; background-color: rgba(0, 0, 0, 0.15); }
.titlebar-button-close:hover { color: #ffffff; background-color: #b43029; }
.menu-button { display: flex; justify-content: center; align-items: center; color: #aaaaaa; font-size: 20px; height: 32px; width: 32px; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; -webkit-app-region: no-drag; -webkit-app-region: no-drag; user-select: none; }
.menu-button:hover { color: #000000; }
.menu { display: block; position: absolute; left: -17em; width: 17em; top: 0; height: 100%; z-index: 2; background-color: #ececec; border-right: 1px solid rgba(255, 255, 255, 0.5); padding-top: 40px; padding-bottom: 2px; margin-left: 0; margin-top: 0; overflow: hidden; transition: 0.1s; }
.menu .menu-group { margin-bottom: 12px; }
.menu .menu-group .menu-group-header { display: block; border: none; border-radius: 0; color: black; width: 100%; text-align: left; margin: 4px 12px 5px 12px; white-space: no-wrap; font-size: 11px; font-weight: bold; color: #bbbbbb; white-space: nowrap; }
.menu .menu-group .menu-command { display: block; border: none; border-radius: 0; background-color: transparent; color: black; width: 100%; text-align: left; padding: 4px 12px 5px 12px; font-size: 12px; }
.menu .menu-group .menu-command:focus { color: #ffffff; background-color: #2e6bd2; outline: none; }
.menu .menu-group .menu-command:disabled { color: #888888; }
.menu .menu-group .menu-command .menu-label { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.menu .menu-group .menu-command .menu-shortcut { display: block; float: right; margin-left: 25px; color: #888888; }
.menu .menu-group .menu-separator { border-top: 1px; border-bottom: 0; border-style: solid; border-color: #e5e5e5; margin-left: 12px; margin-right: 12px; }
.about .titlebar-visible { opacity: 0; }
@-webkit-keyframes orbit { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes orbit { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
.welcome.spinner .logo-spinner-stroke { stroke: #ececec; }
.welcome.spinner .logo-name { display: none; }
.welcome.spinner .open-file-button { display: none; }
.welcome.spinner .target { display: flex; opacity: 0; }
.welcome .notification .logo-name { display: none; }
.welcome .toolbar { display: none; }
@media (prefers-color-scheme: dark) {
:root { color-scheme: dark; }
.default { background-color: #404040; }
.target { background-color: #404040; }
.welcome { background-color: #1e1e1e; color: #888888; }
.alert { background-color: #1e1e1e; color: #888888; }
.logo-stroke { stroke: #888888; }
.logo-fill { fill: #888888; }
.logo-border { stroke: #000000; }
.logo-glyph { fill: #888888; }
.logo-spinner-stroke { stroke: #ffffff; }
.logo-button { color: #888888; background-color: #1e1e1e; border-color: #888888; }
.logo-button:hover { color: #1e1e1e; background-color: #888888; }
.welcome .progress-bar { background-color: #888888; }
.welcome .menu { background-color: #2d2d2d }
.about .logo { background-color: #1e1e1e; color: #888888; }
.about a { color: #c6c6c6; }
.about a:hover { color: #565656; }
.welcome .message-text a { color: #c6c6c6; }
.welcome .message-text a:visited { color: #c6c6c6; }
.welcome .message-text a:hover { color: #565656; }
.toolbar-icon .border { stroke: #333333; }
.toolbar-icon .stroke { stroke: #aaaaaa; }
.toolbar-icon .fill { fill: #aaaaaa; }
.toolbar-icon:hover .stroke { stroke: #dfdfdf; }
.toolbar-icon:hover .fill { fill: #dfdfdf; }
.toolbar-path-back-button { background: #aaaaaa; border-color: #aaaaaa; color: #333333; }
.toolbar-path-back-button:hover { background: #dfdfdf; border-color: #dfdfdf; }
.toolbar-path-name-button { background: #aaaaaa ; border-color: #aaaaaa; color: #404040; }
.toolbar-path-name-button:hover { background: #dfdfdf; border-color: #dfdfdf; }
.toolbar-select select { background: #aaaaaa; border-color: #aaaaaa; color: #404040; }
.toolbar-select select:hover { background: #dfdfdf; border-color: #dfdfdf; color: #404040; }
.toolbar-select-arrow { fill: #404040; }
.titlebar { color: #949494; }
.welcome body { background-color: #1e1e1e; }
.default body { background-color: #404040; }
.active .titlebar { color: #c4c4c4; }
.titlebar-button:hover { color: #ffffff; background-color: rgba(0, 0, 0, 0.15); }
.titlebar-button-close:hover { color: #ffffff; background-color: #b43029; }
.menu-button { color: #aaaaaa; }
.menu-button:hover { color: #ffffff; }
.menu { background-color: #2d2d2d; border-color: rgba(0, 0, 0, 0); }
.menu .menu-group .menu-group-header { color: #666666; }
.menu .menu-group .menu-command { color: #ffffff; }
.menu .menu-group .menu-command:focus { color: #ffffff; background-color: #2e6bd2; }
.menu .menu-group .menu-command:disabled { color: #888888; }
.menu .menu-group .menu-command .shortcut { color: #888888; }
.menu .menu-group .menu-separator { border-color: #363636; }
}
@media all and (max-width: 640px) {
.logo { width: 240px; }
.logo-text { opacity: 0; }
.logo-name { opacity: 0; }
.logo-icon { left: 0; width: 128px; height: 128px; }
.logo-spinner { left: 0; width: 128px; height: 128px; }
.logo .open-file-button { top: 204px; left: 0; }
.message-text { padding-top: 68px; width: 320px; }
.progress { top: 160px; height: 2px; width: 100px; }
.about .logo { width: 100%; padding-left: 0; padding-right: 0; }
.about .logo-message { top: 175px; font-size: 12px; }
.about .logo-github { top: 370px; }
}
.sidebar { display: flex; flex-direction: column; font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "Ubuntu", "Droid Sans", sans-serif; font-size: 12px; height: 100%; right: -100%; position: fixed; transition: 0.1s; top: 0; background-color: #ececec; color: #242424; overflow: hidden; border-left: 1px solid rgba(255, 255, 255, 0.5); opacity: 0; }
.sidebar-title { font-weight: bold; font-size: 12px; letter-spacing: 0.5px; text-transform: uppercase; height: 20px; margin: 0; padding: 20px; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.sidebar-closebutton { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 25px; color: #777777; opacity: 1.0; display: block; transition: 0.2s; position: absolute; top: 0; right: 15px; margin-left: 50px; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.sidebar-closebutton:hover { color: #242424; }
.sidebar-content { display: flex; flex-direction: column; flex-grow: 1; height: 0; }
.sidebar-header { font-weight: bold; font-size: 12px; letter-spacing: 0.5px; text-transform: uppercase; height: 20px; margin: 0; margin-top: 30px; padding-top: 10px; padding-bottom: 10px; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.sidebar-section { font-weight: bold; font-size: 11px; text-transform: uppercase; line-height: 1.25; margin-top: 16px; margin-bottom: 16px; display: block; user-select: none; -webkit-user-select: none; -moz-user-select: none; cursor: default; }
.sidebar-object { flex-grow: 1; padding: 0px 20px 20px 20px; overflow-y: auto; }
.sidebar-item { margin-bottom: 0px; display: block; }
.sidebar-item-name { float: left; font-size: 11px; min-width: 95px; max-width: 95px; padding-right: 5px; padding-top: 7px; display: block; }
.sidebar-item-name input { color: #777; font-family: inherit; font-size: inherit; color: inherit; background-color: inherit; width: 100%; text-align: right; margin: 0; padding: 0; border: 0; outline: none; text-overflow: ellipsis; }
.sidebar-item-value-list { margin: 0; margin-left: 105px; overflow: hidden; display: block; padding: 0; }
.sidebar-item-value { font-size: 11px; background-color: #fcfcfc; border-radius: 2px; border: 1px solid #fcfcfc; margin-top: 3px; margin-bottom: 3px; overflow: auto; }
.sidebar-item-value-content { background-color: #f8f8f8; border: 1px solid #f8f8f8; }
.sidebar-item-value b { font-weight: bold; }
.sidebar-item-value code { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; overflow: auto; white-space: pre-wrap; word-wrap: break-word; }
.sidebar-item-value pre { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; margin: 0; overflow: auto; white-space: pre; word-wrap: normal; display: block; }
.sidebar-item-value-line { padding: 4px 6px 4px 6px; overflow-x: auto; white-space: pre; }
.sidebar-item-value-line-wrap { white-space: pre-wrap; overflow-x: hidden; overflow-wrap: break-word; }
.sidebar-item-value-line-break { padding: 4px 6px 4px 6px; overflow-x: auto; white-space: pre; }
.sidebar-item-value-line-link { padding: 4px 6px 4px 6px; cursor: default; overflow-x: auto; white-space: nowrap; }
.sidebar-item-value-line-link:hover { text-decoration: underline; }
.sidebar-item-value-line-border { padding: 4px 6px 4px 6px; border-top: 1px solid rgba(27, 31, 35, 0.05); }
.sidebar-item-value-line-content { white-space: pre; word-wrap: normal; overflow: auto; display: block; }
.sidebar-item-value-expander { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; float: right; color: #aaa; cursor: pointer; user-select: none; -webkit-user-select: none; -moz-user-select: none; padding: 4px 6px 4px 4px; }
.sidebar-item-value-expander:hover { color: #333; }
.sidebar-item-value-button { display: flex; justify-content: center; align-items: center; font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; width: 22px; height: 22px; cursor: pointer; user-select: none; -webkit-user-select: none; -moz-user-select: none; color: #aaa; }
.sidebar-item-value-button svg use { fill: #aaa; stroke: #aaa; }
.sidebar-item-value-button:hover svg use { fill: #333; stroke: #333; }
.sidebar-item-value-button-tool { float: right; padding-left: 3px; }
.sidebar-item-value-button-context { float: right; }
.sidebar-item-selector {
 font-family: inherit; font-size: 12px;
 background-color: #fcfcfc; border: #fcfcfc; color: #333;
 border-radius: 2px; width: 100%; height: 23px; padding: 3px 12px 3px 7px;
 margin-top: 3px; margin-bottom: 3px; outline: none;
 box-sizing: border-box; -moz-box-sizing: border-box;
 appearance: none; -webkit-appearance: none; -moz-appearance: none;
 background-image: linear-gradient(45deg, transparent 50%, #333 50%), linear-gradient(135deg, #333 50%, transparent 50%);
 background-position: calc(100% - 12px) calc(10px), calc(100% - 7px) calc(10px);
 background-size: 5px 5px, 5px 5px;
 background-repeat: no-repeat;
}
.sidebar-separator { margin-bottom: 20px; }
.sidebar-find-search { display: flex; align-items: center; background: #fff; border-radius: 16px; margin: 0px 20px 8px 20px; padding: 0px 8px 0px 8px; }
.sidebar-find-query { width: 100vw; background: none; font-family: inherit; font-size: 13px; padding: 8px 8px 8px 8px; border: 0; outline: 0; }
.sidebar-find-toggle { margin-left: auto; margin-right: 2px; width: 16px; height: 16px; cursor: pointer; }
.sidebar-find-toggle input[type="checkbox"] { display: none; }
.sidebar-find-toggle input[type="checkbox"]:not(:checked) + svg { fill: #ccc; stroke: #ccc; }
.sidebar-find-toggle input[type="checkbox"]:checked + svg { fill: #555; stroke: #555; }
.sidebar-find-toggle-icon { stroke: #555; fill: #555; width: 16px; height: 16px; }
.sidebar-find-content { flex-grow: 1; padding: 0px 20px 20px 20px; overflow-y: auto; list-style-type: none; margin: 0; }
.sidebar-find-content li *:first-child { margin-right: 2px; }
.sidebar-find-content li { color: #666; font-size: 13px; height: 22px; line-height: 22px; padding: 0 12px 0 12px; outline: 0; white-space: nowrap; border-radius: 3px; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.sidebar-find-content li:hover { background: #e5e5e5; color: #000; }
.sidebar-find-content-icon { stroke: #555; fill: #555; float: left; width: 16px; height: 16px; padding: 3px; }
.sidebar-documentation { flex-grow: 1; padding: 0px 20px 20px 20px; overflow-y: auto; font-size: 13px; line-height: 1.5; margin: 0; }
.sidebar-documentation h1 { font-weight: bold; font-size: 13px; line-height: 1.25; border-bottom: 1px solid #e8e8e8; padding-bottom: 0.3em; margin-top: 0; margin-bottom: 16px; }
.sidebar-documentation h2 { font-weight: bold; font-size: 13px; line-height: 1.25; margin-top: 20px; margin-bottom: 16px; text-transform: uppercase; border: 0; }
.sidebar-documentation h3 { font-weight: bold; font-size: 11px; line-height: 1.25; }
.sidebar-documentation p { margin-top: 4px; margin-bottom: 4px; margin-left: 0px; }
.sidebar-documentation a { color: #237; }
.sidebar-documentation code { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 12px; background-color: rgba(27, 31, 35, 0.05); padding: 0.2em 0.4em; margin: 0; border-radius: 3px; }
.sidebar-documentation pre { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 12px; padding: 16px; overflow: auto; line-height: 1.45; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; }
.sidebar-documentation pre code { font-size: 13px; padding: 16px; line-height: 1.45; background-color: transparent; padding: 0; border-radius: 0; }
.sidebar-documentation tt { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-weight: bold; font-size: 90%; background-color: rgba(27, 31, 35, 0.05); border-radius: 3px; padding: 0.2em 0.4em; margin: 0; }
.sidebar-documentation dl dt { font-size: 13px; font-weight: bold; padding: 0; margin-top: 16px; margin-left: 0px; }
.sidebar-documentation dd { padding: 0 16px; margin-left: 0; margin-bottom: 16px; }
.sidebar-documentation ul { margin-top: 6px; margin-bottom: 6px; padding-left: 20px; }
.sidebar-documentation blockquote { margin-left: 15px; margin-right: 15px; }
@media (prefers-color-scheme: dark) {
 .sidebar html { color: #dfdfdf; }
 .sidebar { background-color: #2d2d2d; color: #dfdfdf; border-left: 1px solid rgba(0, 0, 0, 0); }
 .sidebar-closebutton { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 25px; color: #777777; opacity: 1.0; display: block; transition: 0.2s; position: absolute; top: 0; right: 15px; margin-left: 50px; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
 .sidebar-closebutton:hover { color: #ffffff; }
 .sidebar-item-value { background-color: #383838; border-color: #383838; }
 .sidebar-item-value-content { background-color: #3e3e3e; border-color: #3e3e3e; }
 .sidebar-item-value-line-border { border-color: rgba(0, 0, 0, 0.09); }
 .sidebar-item-selector { background-color: #383838; border: #383838; color: #dfdfdf; background-image: linear-gradient(45deg, transparent 50%, #aaa 50%), linear-gradient(135deg, #aaa 50%, transparent 50%); }
 .sidebar-item-disable-select { user-select: none; -webkit-user-select: none; -moz-user-select: none; }
 .sidebar-header { border-bottom-color: #2d2d2d; color: #dfdfdf; }
 .sidebar-documentation h1 { border-bottom: 1px solid #424242; color: #dfdfdf; }
 .sidebar-documentation h2 { color: #dfdfdf; }
 .sidebar-documentation p { color: #aaaaaa; }
 .sidebar-documentation a { color: #6688aa; }
 .sidebar-documentation tt { background-color:#1e1e1e; }
 .sidebar-documentation code { background-color: #1e1e1e; }
 .sidebar-documentation pre { background-color: #1e1e1e; }
 .sidebar-find-search { background: #383838; color: #dfdfdf; border-color: #424242; }
 .sidebar-find-toggle input[type="checkbox"]:not(:checked) + svg { fill: #555; stroke: #555; }
 .sidebar-find-toggle input[type="checkbox"]:checked + svg { fill: #aaa; stroke: #aaa; }
 .sidebar-find-content li { color: #aaaaaa; }
 .sidebar-find-content li:hover { background: #383838; color: #dfdfdf; }
 .sidebar-find-content-icon { stroke: #888888; fill: #888888; }
 .sidebar-item-value-expander { color: #888; }
 .sidebar-item-value-expander:hover { color: #e5e5e5; }
 .sidebar-item-value-button { color: #888; }
 .sidebar-item-value-button svg use { fill: #888; stroke: #888; }
 .sidebar-item-value-button:hover svg use { fill: #e5e5e5; stroke: #e5e5e5; }
}
@media screen and (prefers-reduced-motion: reduce) {
.menu { transition: none; }
.sidebar { transition: none; }
}
</style>
</head>
<body class="welcome spinner">
<div id="target" class="target" tabindex="0">
</div>
<div id="sidebar" class="sidebar">
 <h1 id="sidebar-title" class="sidebar-title"></h1>
 <a id="sidebar-closebutton" class="sidebar-closebutton" href="javascript:void(0)" draggable="false">&times;</a>
 <div id="sidebar-content" class="sidebar-content"></div>
 <svg width="0" height="0" display="none">
 <defs>
 <symbol id="sidebar-icon-node" viewBox="0 0 20 20">
 <circle cx="10" cy="10" r="6" stroke-width="2" fill="none"/>
 </symbol>
 <symbol id="sidebar-icon-connection" viewBox="0 0 20 20">
 <line x1="4" y1="10" x2="15" y2="10" stroke-width="2" />
 <polyline points="11,6 15,10 11,14" stroke-width="2" />
 </symbol>
 <symbol id="sidebar-icon-weight" viewBox="0 0 20 20">
 <circle cx="5" cy="5" r="1" />
 <circle cx="10" cy="5" r="1" />
 <circle cx="15" cy="5" r="1" />
 <circle cx="5" cy="10" r="1" />
 <circle cx="10" cy="10" r="1" />
 <circle cx="15" cy="10" r="1" />
 <circle cx="5" cy="15" r="1" />
 <circle cx="10" cy="15" r="1" />
 <circle cx="15" cy="15" r="1" />
 </symbol>
 </defs>
 </svg>
</div>
<div id="toolbar" class="toolbar">
 <button id="zoom-in-button" class="toolbar-button" title="Zoom In">
 <svg class="toolbar-icon" viewbox="0 0 100 100">
 <circle class="border" cx="50" cy="50" r="35" stroke-width="8" stroke="#fff"></circle>
 <line class="border" x1="50" y1="38" x2="50" y2="62" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="38" y1="50" x2="62" y2="50" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="78" y1="78" x2="82" y2="82" stroke-width="12" stroke-linecap="square" stroke="#fff"></line>
 <circle class="stroke" cx="50" cy="50" r="35" stroke-width="4"></circle>
 <line class="stroke" x1="50" y1="38" x2="50" y2="62" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="38" y1="50" x2="62" y2="50" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="78" y1="78" x2="82" y2="82" stroke-width="8" stroke-linecap="square"></line>
 </svg>
 </button>
 <button id="zoom-out-button" class="toolbar-button" title="Zoom Out">
 <svg class="toolbar-icon" viewbox="0 0 100 100">
 <circle class="border" cx="50" cy="50" r="35" stroke-width="8" stroke="#fff"></circle>
 <line class="border" x1="38" y1="50" x2="62" y2="50" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="78" y1="78" x2="82" y2="82" stroke-width="12" stroke-linecap="square" stroke="#fff"></line>
 <circle class="stroke" cx="50" cy="50" r="35" stroke-width="4"></circle>
 <line class="stroke" x1="38" y1="50" x2="62" y2="50" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="78" y1="78" x2="82" y2="82" stroke-width="8" stroke-linecap="square"></line>
 </svg>
 </button>
 <button id="sidebar-model-button" class="toolbar-button" title="Model Properties">
 <svg class="toolbar-icon" viewbox="0 0 100 100">
 <rect class="border" x="12" y="12" width="76" height="76" rx="16" ry="16" stroke-width="8"></rect>
 <line class="border" x1="28" y1="37" x2="32" y2="37" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="28" y1="50" x2="32" y2="50" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="28" y1="63" x2="32" y2="63" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="40" y1="37" x2="70" y2="37" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="40" y1="50" x2="70" y2="50" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <line class="border" x1="40" y1="63" x2="70" y2="63" stroke-width="8" stroke-linecap="round" stroke="#fff"></line>
 <rect class="stroke" x="12" y="12" width="76" height="76" rx="16" ry="16" stroke-width="4"></rect>
 <line class="stroke" x1="28" y1="37" x2="32" y2="37" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="28" y1="50" x2="32" y2="50" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="28" y1="63" x2="32" y2="63" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="40" y1="37" x2="70" y2="37" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="40" y1="50" x2="70" y2="50" stroke-width="4" stroke-linecap="round"></line>
 <line class="stroke" x1="40" y1="63" x2="70" y2="63" stroke-width="4" stroke-linecap="round"></line>
 </svg>
 </button>
 <button id="sidebar-target-button" class="toolbar-button" title="Target Properties">
 <svg class="toolbar-icon" viewBox="0 0 100 100">
 <rect class="border" x="12" y="12" width="76" height="76" rx="16" ry="16" stroke-width="8"></rect>
 <circle class="border" cx="50" cy="50" r="18" stroke-width="8"></circle>
 <circle class="border" cx="50" cy="50" r="3" stroke-width="8"></circle>
 <rect class="stroke" x="12" y="12" width="76" height="76" rx="16" ry="16" stroke-width="4"></rect>
 <circle class="stroke" cx="50" cy="50" r="18" stroke-width="4"></circle>
 <circle class="stroke fill" cx="50" cy="50" r="3" stroke-width="4"></circle>
 </svg>
 </button>
 <div id="toolbar-navigator" class="toolbar-select">
 <select id="toolbar-target-selector">
 <option value="Graphs" disabled="true">&#x2014; Graphs &#x2014;&#x2014;</option>
 <option value="add">add</option>
 <option value="subtract">subtract</option>
 <option value="multiply">multiply</option>
 <option value="Functions" disabled="true">&#x2014; Functions &#x2014;&#x2014;</option>
 <option value="line">foo_bar.foo</option>
 </select>
 <svg class="toolbar-select-arrow" viewBox="0 0 10 6" width="10" height="6">
 <path d="M0 0L5 6L10 0Z" />
 </svg>
 </div>
 <div id="toolbar-path" class="toolbar-path">
 <button id="toolbar-path-back-button" class="toolbar-path-back-button" title="Back">
 &#x276E;
 </button>
 </div>
</div>
<div id="logo" class="center logo">
<a id="logo-github" class="center logo-github" href="https://github.com/lutzroeder/netron" target="blank_">
 <svg viewbox="0 0 438.549 438.549">
 <path class="logo-fill" d="M409.132,114.573c-19.608-33.596-46.205-60.194-79.798-79.8C295.736,15.166,259.057,5.365,219.271,5.365
 c-39.781,0-76.472,9.804-110.063,29.408c-33.596,19.605-60.192,46.204-79.8,79.8C9.803,148.168,0,184.854,0,224.63
 c0,47.78,13.94,90.745,41.827,128.906c27.884,38.164,63.906,64.572,108.063,79.227c5.14,0.954,8.945,0.283,11.419-1.996
 c2.475-2.282,3.711-5.14,3.711-8.562c0-0.571-0.049-5.708-0.144-15.417c-0.098-9.709-0.144-18.179-0.144-25.406l-6.567,1.136
 c-4.187,0.767-9.469,1.092-15.846,1c-6.374-0.089-12.991-0.757-19.842-1.999c-6.854-1.231-13.229-4.086-19.13-8.559
 c-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559
 c-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-0.951-2.568-2.098-3.711-3.429c-1.142-1.331-1.997-2.663-2.568-3.997
 c-0.572-1.335-0.098-2.43,1.427-3.289c1.525-0.859,4.281-1.276,8.28-1.276l5.708,0.853c3.807,0.763,8.516,3.042,14.133,6.851
 c5.614,3.806,10.229,8.754,13.846,14.842c4.38,7.806,9.657,13.754,15.846,17.847c6.184,4.093,12.419,6.136,18.699,6.136
 c6.28,0,11.704-0.476,16.274-1.423c4.565-0.952,8.848-2.383,12.847-4.285c1.713-12.758,6.377-22.559,13.988-29.41
 c-10.848-1.14-20.601-2.857-29.264-5.14c-8.658-2.286-17.605-5.996-26.835-11.14c-9.235-5.137-16.896-11.516-22.985-19.126
 c-6.09-7.614-11.088-17.61-14.987-29.979c-3.901-12.374-5.852-26.648-5.852-42.826c0-23.035,7.52-42.637,22.557-58.817
 c-7.044-17.318-6.379-36.732,1.997-58.24c5.52-1.715,13.706-0.428,24.554,3.853c10.85,4.283,18.794,7.952,23.84,10.994
 c5.046,3.041,9.089,5.618,12.135,7.708c17.705-4.947,35.976-7.421,54.818-7.421s37.117,2.474,54.823,7.421l10.849-6.849
 c7.419-4.57,16.18-8.758,26.262-12.565c10.088-3.805,17.802-4.853,23.134-3.138c8.562,21.509,9.325,40.922,2.279,58.24
 c15.036,16.18,22.559,35.787,22.559,58.817c0,16.178-1.958,30.497-5.853,42.966c-3.9,12.471-8.941,22.457-15.125,29.979
 c-6.191,7.521-13.901,13.85-23.131,18.986c-9.232,5.14-18.182,8.85-26.84,11.136c-8.662,2.286-18.415,4.004-29.263,5.146
 c9.894,8.562,14.842,22.077,14.842,40.539v60.237c0,3.422,1.19,6.279,3.572,8.562c2.379,2.279,6.136,2.95,11.276,1.995
 c44.163-14.653,80.185-41.062,108.068-79.226c27.88-38.161,41.825-81.126,41.825-128.906
 C438.536,184.851,428.728,148.168,409.132,114.573z"/>
 </svg>
 </a>
 <button id="open-file-button" class="center logo-button open-file-button" tabindex="0">Open Model&hellip;</button>
 <div class="center progress">
 <div id="progress-bar" class="progress-bar"></div>
 </div>
 <input type="file" id="open-file-dialog" class="open-file-dialog" multiple="false" accept="">
 <!-- Preload fonts to workaround Chrome SVG layout issue -->
 <div style="font-weight: normal; color: rgba(0, 0, 0, 0.01); user-select: none;">.</div>
 <div style="font-weight: bold; color: rgba(0, 0, 0, 0.01); user-select: none;">.</div>
 <div style="font-weight: bold; color: rgba(0, 0, 0, 0.01); user-select: none;">.</div>
</div>
<div id="message" class="message">
 <div id="message-text" class="message-text"></div>
 <button id="message-button" class="logo-button message-button" tabindex="0">OK</button>
</div>
<div id="titlebar" class="titlebar">
 <svg style="position: absolute; width: 0px; height: 0px; overflow: hidden;" aria-hidden="true">
 <symbol id="icon-arrow-right" viewBox="0 0 1024 1024">
 <path d="M698.75712 565.02272l-191.488 225.4848a81.73568 81.73568 0 0 1-62.48448 28.89728 81.89952 81.89952 0 0 1-62.40256-134.94272l146.432-172.4416-146.432-172.4416a81.92 81.92 0 0 1 124.88704-106.06592l191.488 225.4848a81.87904 81.87904 0 0 1 0 106.02496z"></path>
 </symbol>
 </svg>
 <div id="titlebar-content" class="titlebar-content">
 <span id="titlebar-content-text" class="titlebar-content-text"></span>
 </div>
 <div id="titlebar-control-box" class="titlebar-control-box">
 <div id="titlebar-close" class="titlebar-button titlebar-button-close" title="Close">
 <svg class="titlebar-icon" aria-hidden="true">
 <path d="M 0,0 0,0.7 4.3,5 0,9.3 0,10 0.7,10 5,5.7 9.3,10 10,10 10,9.3 5.7,5 10,0.7 10,0 9.3,0 5,4.3 0.7,0 Z"></path>
 </svg>
 </div>
 <div id="titlebar-toggle" class="titlebar-button" title="Maximize">
 <svg id="titlebar-maximize" class="titlebar-icon" aria-hidden="true" style="position: absolute;">
 <path d="M 0,0 0,10 10,10 10,0 Z M 1,1 9,1 9,9 1,9 Z"></path>
 </svg>
 <svg id="titlebar-restore" class="titlebar-icon" aria-hidden="true" style="position: absolute;">
 <path d="m 2,1e-5 0,2 -2,0 0,8 8,0 0,-2 2,0 0,-8 z m 1,1 6,0 0,6 -1,0 0,-5 -5,0 z m -2,2 6,0 0,6 -6,0 z"></path>
 </svg>
 </div>
 <div id="titlebar-minimize" class="titlebar-button" title="Minimize">
 <svg class="titlebar-icon" aria-hidden="true">
 <path d="M 0,5 10,5 10,6 0,6 Z"></path>
 </svg>
 </div>
 </div>
</div>
<div id="menu" class="menu"></div>
<div id="menu-button" class="menu-button">&#8801;</div>
</body>
</html>