diff --git a/docs/Terminal-Basic/TerminalBasic.css b/docs/Terminal-Basic/TerminalBasic.css
new file mode 100644
index 0000000000..9484331fcb
--- /dev/null
+++ b/docs/Terminal-Basic/TerminalBasic.css
@@ -0,0 +1,143 @@
+:root {
+  --selectionBackground: #a4c9ff;
+  --cursorColor: #7f7f7f;
+  --foreground: #000000;
+  --background: #ffffff;
+  --brightWhite: #e5e5e5;
+  --brightCyan: #00e5e5;
+  --brightPurple: #e500e5;
+  --brightBlue: #0000ff;
+  --brightYellow: #e5e500;
+  --brightGreen: #00d900;
+  --brightRed: #e50000;
+  --brightBlack: #666666;
+  --white: #bfbfbf;
+  --cyan: #00a6b2;
+  --purple: #b200b2;
+  --blue: #0000b2;
+  --yellow: #999900;
+  --green: #00a600;
+  --red: #990000;
+  --black: #000000;
+  --name: 'Terminal Basic';
+  --IsBright: 1;
+  --IsDark: 0;
+}
+
+.colorSchemeName::before, .ColorSchemeName::before { content: 'Terminal Basic'; }
+.colorSchemeFileName::before, .ColorSchemeFileName::before { content: 'TerminalBasic.css'; }
+
+.foreground, .Foreground { color: var(--foreground);            }
+.background, .Background { background-color: var(--background); }
+
+.foreground-border , .Foreground-Border   { border-color: var(--foreground)  }
+.foreground-fill   , .Foreground-Fill     { fill: var(--foreground)          }
+.foreground-stroke , .Foreground-Stroke   { stroke: var(--foreground)        }
+
+.background-border , .Background-Border  { border-color: var(--background)   }
+.background-fill   , .Background-Fill    { fill: var(--background)           }
+.background-stroke , .Background-Stroke  { stroke: var(--background)         }
+.output   , .Output      { color: var(--foreground)   }
+.success  , .Success     { color: var(--brightGreen)  }
+.failure  , .Failure     { color: var(--red)          }
+.error    , .Error       { color: var(--brightRed)    }
+.warning  , .Warning     { color: var(--brightYellow) }
+.debug    , .Debug       { color: var(--yellow)       }
+.verbose  , .Verbose     { color: var(--brightCyan)   }
+.progress , .Progress    { color: var(--cyan)         }
+.link     , .Link        { color: var(--cyan)         }
+
+.error-border      , .Error-Border       { border-color: var(--brightRed)    }
+.error-fill        , .Error-Fill         { fill: var(--brightRed)            }
+.error-stroke      , .Error-Stroke       { stroke: var(--brightRed)          }
+
+.success-border    , .Success-Border     { border-color: var(--brightGreen)  }
+.success-fill      , .Sucesss-Fill       { fill: var(--brightGreen)          } 
+.sucesss-stroke    , .Success-Stroke     { stroke: var(--brightGreen)        }
+
+.warning-border    , .Warning-Border     { border-color: var(--brightYellow) }
+.warning-fill      , .Warning-Fill       { fill: var(--brightYellow)         }
+.warning-stroke    , .Warning-Stroke     { stroke: var(--brightYellow)       }
+.black   ,  .Black   , .ANSI0  { color: var(--black)  }
+.red     ,  .Red     , .ANSI1  { color: var(--red)    }
+.green   ,  .Green   , .ANSI2  { color: var(--green)  }
+.yellow  ,  .Yellow  , .ANSI3  { color: var(--yellow) }
+.blue    ,  .Blue    , .ANSI4  { color: var(--blue)   }
+.magenta ,  .Magenta , .ANSI5  { color: var(--purple) }
+.cyan    ,  .Cyan    , .ANSI6  { color: var(--cyan)   }
+.white   ,  .White   , .ANSI7  { color: var(--white)  }
+
+.brightblack   ,  .bright-black   , .BrightBlack   , .ANSI8   { color: var(--brightBlack)  }
+.brightred     ,  .bright-red     , .BrightRed     , .ANSI9   { color: var(--brightRed)    }
+.brightgreen   ,  .bright-green   , .BrightGreen   , .ANSI10  { color: var(--brightGreen)  }
+.brightyellow  ,  .bright-yellow  , .BrightYellow  , .ANSI11  { color: var(--brightYellow) }
+.brightblue    ,  .bright-blue    , .BrightBlue    , .ANSI12  { color: var(--brightBlue)   }
+.brightmagenta ,  .bright-magenta , .BrightMagenta , .ANSI13  { color: var(--brightPurple) }
+.brightcyan    ,  .bright-cyan    , .BrightCyan    , .ANSI14  { color: var(--brightCyan)   }
+.brightwhite   ,  .bright-white   , .BrightWhite   , .ANSI15  { color: var(--brightWhite)  }
+
+.purple       ,  .Purple  { color: var(--purple) }
+
+.brightpurple ,  .bright-purple , .BrightPurple  { color: var(--brightPurple) }
+.black-fill   ,  .BlackFill   , .ANSI0-Fill,   .ansi0-fill   { fill: var(--black)  }
+.red-fill   ,  .RedFill   , .ANSI1-Fill,   .ansi1-fill   { fill: var(--red)  }
+.green-fill   ,  .GreenFill   , .ANSI2-Fill,   .ansi2-fill   { fill: var(--green)  }
+.yellow-fill   ,  .YellowFill   , .ANSI3-Fill,   .ansi3-fill   { fill: var(--yellow)  }
+.blue-fill   ,  .BlueFill   , .ANSI4-Fill,   .ansi4-fill   { fill: var(--blue)  }
+.magenta-fill   ,  .MagentaFill   , .ANSI5-Fill,   .ansi5-fill   { fill: var(--purple)  }
+.purple-fill, .PurpleFill     { fill: var(--purple) }
+.cyan-fill   ,  .CyanFill   , .ANSI6-Fill,   .ansi6-fill   { fill: var(--cyan)  }
+.white-fill   ,  .WhiteFill   , .ANSI7-Fill,   .ansi7-fill   { fill: var(--white)  }
+.brightblack-fill   ,  .bright-black-fill   , .BrightBlackFill   , .ANSI8-Fill, .ansi8-fill   { fill: var(--brightBlack)         }
+.brightred-fill   ,  .bright-red-fill   , .BrightRedFill   , .ANSI9-Fill, .ansi9-fill   { fill: var(--brightRed)                 }
+.brightgreen-fill   ,  .bright-green-fill   , .BrightGreenFill   , .ANSI10-Fill, .ansi10-fill   { fill: var(--brightGreen)       }
+.brightyellow-fill   ,  .bright-yellow-fill   , .BrightYellowFill   , .ANSI11-Fill, .ansi11-fill   { fill: var(--brightYellow)   }
+.brightblue-fill   ,  .bright-blue-fill   , .BrightBlueFill   , .ANSI12-Fill, .ansi12-fill   { fill: var(--brightBlue)           }
+.brightmagneta-fill   ,  .bright-magneta-fill   , .BrightMagnetaFill   , .ANSI13-Fill, .ansi13-fill   { fill: var(--brightPurple) }
+.brightpurple-fill      , .bright-purple-fill, .BrightPurpleFill { fill: var(--brightPuple)                                      }
+.brightcyan-fill   ,  .bright-cyan-fill   , .BrightCyanFill   , .ANSI14-Fill, .ansi14-fill   { fill: var(--brightCyan)           }
+.brightwhite-fill   ,  .bright-white-fill   , .BrightWhiteFill   , .ANSI15-Fill, .ansi15-fill   { fill: var(--brightWhite)       }
+.black-stroke ,  .BlackStroke , .ANSI0-Stroke, .ansi0-stroke { stroke: var(--black)  }
+.red-stroke ,  .RedStroke , .ANSI1-Stroke, .ansi1-stroke { stroke: var(--red)  }
+.green-stroke ,  .GreenStroke , .ANSI2-Stroke, .ansi2-stroke { stroke: var(--green)  }
+.yellow-stroke ,  .YellowStroke , .ANSI3-Stroke, .ansi3-stroke { stroke: var(--yellow)  }
+.blue-stroke ,  .BlueStroke , .ANSI4-Stroke, .ansi4-stroke { stroke: var(--blue)  }
+.magenta-stroke ,  .MagentaStroke , .ANSI5-Stroke, .ansi5-stroke { stroke: var(--purple)  }
+.purple-stroke, .PurpleStroke { fill: var(--purple) }
+.cyan-stroke ,  .CyanStroke , .ANSI6-Stroke, .ansi6-stroke { stroke: var(--cyan)  }
+.white-stroke ,  .WhiteStroke , .ANSI7-Stroke, .ansi7-stroke { stroke: var(--white)  }
+.brightblack-stroke ,  .bright-black-stroke , .BrightBlackFill   , .ANSI8-Fill, .ansi8-fill   { stroke: var(--brightBlack)  }
+.brightred-stroke ,  .bright-red-stroke , .BrightRedFill   , .ANSI9-Fill, .ansi9-fill   { stroke: var(--brightRed)  }
+.brightgreen-stroke ,  .bright-green-stroke , .BrightGreenFill   , .ANSI10-Fill, .ansi10-fill   { stroke: var(--brightGreen)     }
+.brightyellow-stroke ,  .bright-yellow-stroke , .BrightYellowFill   , .ANSI11-Fill, .ansi11-fill   { stroke: var(--brightYellow) }
+.brightblue-stroke ,  .bright-blue-stroke , .BrightBlueFill   , .ANSI12-Fill, .ansi12-fill   { stroke: var(--brightBlue)  }
+.brightmagneta-stroke ,  .bright-magneta-stroke , .BrightMagnetaFill   , .ANSI13-Fill, .ansi13-fill   { stroke: var(--brightPuple)  }
+.brightpurple-stroke    , .bright-purple-stroke, .BrightPurpleStroke { fill: var(--brightPuple)  }
+.brightcyan-stroke ,  .bright-cyan-stroke , .BrightCyanFill   , .ANSI14-Fill, .ansi14-fill   { stroke: var(--brightCyan)  }
+.brightwhite-stroke ,  .bright-white-stroke , .BrightWhiteFill   , .ANSI15-Fill, .ansi15-fill   { stroke: var(--brightWhite)     }
+
+body {
+    color: var(--foreground);
+    background-color: var(--background);
+}
+
+a, a:visited, a:hover  { color: var(--cyan); }
+
+::selection, ::-moz-selection {
+    color: var(--cursorColor);
+    background-color: var(--selectionBackground);
+}
+    
+form input[type="text"], form input[type="checkbox"], input[type="button"], textarea, select, option {
+    color: var(--foreground);
+    background-color: var(--background);
+}
+
+form input[type="text"], textarea, select {
+    border : 1px solid var(--foreground);
+    outline: 1px solid var(--foreground);
+}
+
+hr {
+    color: var(--foreground)
+}