Da OS

Intro

Kinda look like web OS, right? Not so!
There's not too many apps (only wallpaper change, css modifier, js runner and msgbox creator.), then how to use it?
Well, I say it's EASY!!! You just have to know CSS and HTML!

Creating apps like pro B)

In MSGBox gen, you have to use HTML instead of default TXT!
That's a biiit harder, but if you know HTML, it's super easy! Just put in some code,

And done!

How to edit style

To edit style, edit CSS (Cascading Stylesheet) with fastest and easiest-to-use CSS editor ever!

Change wallpaper

You can change wallpaper with 3 ways using EASIEST HTML/CSS/JS WP EDITOR EVER!
Just use image link or image from storage or CSS to change it! It's very easy, and where's all ways to do it to websites!

Lazy as cat, give me some codes =)

Use HTML codes in MSGBox gen, to make what I wanted from you!

Browser

Your browser (may not work in some browsers or work bad)

Pov: virus

Styles

Literally Windows XP!!!

/* Reset and base styles */
body {
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 100vw;
  background-image: url('https://archive.org/download/bliss-600dpi/bliss-600dpi.png');
  background-size: cover;
  font-family: Tahoma;
  overflow: hidden;
}

/* Control Panel Bar (like Windows XP) */
.ctrlpanel {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px;
  background-image: url("taskbar.png");
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  box-shadow: inset 0px -1px #00000033;
}

/* Start Button Style */
.start {
  background-color: #00AA00; /* green */
  color: white;
  font-weight: bold;
  padding:5px 10px;
  border-radius:3px;
  box-shadow: inset -1px -1px #00000033;
  cursor:pointer;
}
.start:hover {
   background-color:#009900; 
}

/* Time display style */
.time {
   color:white; 
   font-family:'Courier New', monospace; 
   font-size:14px; 
}

/* Start Menu Styles */
#startMenu {
   position:absolute; 
   bottom:40px; /* above control panel */ 
   left:10px; 
   background:#fff; 
   border-radius:4px; 
   box-shadow:0px4px8px rgba(0,0,0,0.3); 
   display:none; 
   min-width:150px; 
   z-index:2000; 
}
#startMenu .opt {
   padding:8px; 
   cursor:pointer; 
   color:#000; 
}
#startMenu .opt:hover {
   background:#3399ff; 
   color:#fff; 
}

/* Window styles (for custom windows) */
.window {
    position:absolute;
    top:auto; /* will be set dynamically */
    left:auto; /* will be set dynamically */
    width:auto;
    min-width:300px;
    min-height:auto;
    background:#fff;
    border-radius:4px;
    box-shadow:
      rgba(0,0,0,0.2) -2px -2px inset,
      rgba(255,255,255,0.7) inset,
      rgba(0,0,0,0.2) -2px -2px,
      rgba(255,255,255,1) -4px -4px,
      rgba(255,255,255,.7) -6px -6px,
      rgba(255,255,255,.5) -8px -8px,
      rgba(255,255,255,.3) -10px -10px,
      rgba(255,255,255,.2) -12px -12px
    ;
    overflow:hidden;
}
.window .title {
    background-image: url("taskbar.png");
    color:#fff;
    padding:.5em;
    cursor:pointer; /* for dragging later */
}
.window .close {
    position: absolute;
    top: .2em;
    right: .2em;
    width: 32px; /* changed from 0.8em */
    height: 32px; /* changed from 0.8em */
    border-radius: 50%; /* optional for circular button */
    text-align: center;
    font-weight: bold;
    font-size: 1em; /* or adjust as needed */
    color: #fff;
    background: #900;
    border: none;
    cursor: pointer;
}
.window .close:hover {
    background:#c00;
}
.window .content {
    padding:.5em;
}
.resize-handle {
  width: 10px;
  height: 10px;
  background: transparent; /* or a visible icon */
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  position: absolute;
  right: 0;
  bottom: 0;
  cursor: se-resize; /* cursor indicates resize */
}

Literally Windows 7!!!

/* Reset and base styles */
body {
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 100vw;
  background-image: url('https://lampik499site.neocities.org/img0.jpg');
  background-size: cover;
  font-family: Segoe UI;
  overflow: hidden;
}

/* Control Panel Bar (like Windows XP) */
.ctrlpanel {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px;
  background-image: url("https://lampik499site.neocities.org/07.png");
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  box-shadow: inset 0px -1px #00000033;
}

/* Time display style */
.time {
   color:white; 
   font-family:'Courier New', monospace; 
   font-size:14px; 
}

/* Window styles (for custom windows) */
.window {
    position:absolute;
    top:auto; /* will be set dynamically */
    left:auto; /* will be set dynamically */
    width:auto;
    min-width:300px;
    min-height:auto;
    background:#fff;
    border-radius:4px;
    box-shadow:
      rgba(0,0,0,0.2) -2px -2px inset,
      rgba(255,255,255,0.7) inset,
      rgba(0,0,0,0.2) -2px -2px,
      rgba(255,255,255,1) -4px -4px,
      rgba(255,255,255,.7) -6px -6px,
      rgba(255,255,255,.5) -8px -8px,
      rgba(255,255,255,.3) -10px -10px,
      rgba(255,255,255,.2) -12px -12px
    ;
    overflow:hidden;
}
.window .title {
    background-image: url("https://lampik499site.neocities.org/07.png");
    color:#fff;
    padding:.5em;
}
.window .close {
    position: absolute;
    top: .2em;
    right: .2em;
    width: 32px; /* changed from 0.8em */
    height: 32px; /* changed from 0.8em */
    border-radius: 50%; /* optional for circular button */
    text-align: center;
    font-weight: bold;
    font-size: 1em; /* or adjust as needed */
    color: #fff;
    background: #799abc;
    border: none;
    cursor: pointer;
    opacity: 50%;
}
.window .close:hover {
    background:#799abc;
    opacity: 100%
}
.window .content {
    padding:.5em;
}

Literally Windows 10!!!

/* Reset and base styles */
body {
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 100vw;
  background-image: url('w100.jpg');
  background-size: 100%;
  font-family: Segoe UI;
  overflow: hidden;
}

/* Control Panel Bar */
.ctrlpanel {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  box-shadow: inset 0px -1px #00000033;
  color: black;
}

/* Start Button Style */
.start {
  background-color: white;
  color: #007cf7;
  font-weight: bold;
  padding:5px 10px;
  border-radius:3px;
  box-shadow: inset -1px -1px #00000033;
  cursor:pointer;
}
.start:hover {
   background-color: black;
}

/* Time display style */
.time {
   color: black; 
   font-family:'Courier New', monospace; 
   font-size:14px; 
}

/* Window styles (for custom windows) */
.window {
    position:absolute;
    top:auto; /* will be set dynamically */
    left:auto; /* will be set dynamically */
    width:auto;
    min-width:300px;
    min-height:auto;
    background:#fff;
    box-shadow:
      rgba(0,0,0,0.2) -2px -2px inset,
      rgba(255,255,255,0.7) inset,
      rgba(0,0,0,0.2) -2px -2px,
      rgba(255,255,255,1) -4px -4px,
      rgba(255,255,255,.7) -6px -6px,
      rgba(255,255,255,.5) -8px -8px,
      rgba(255,255,255,.3) -10px -10px,
      rgba(255,255,255,.2) -12px -12px
    ;
    overflow:hidden;
}
.window .title {
    background: white;
    color:#000;
    padding:.5em;
    cursor:pointer; /* for dragging later */
}
.window .close {
    position: absolute;
    top: .2em;
    right: .2em;
    width: 32px; /* changed from 0.8em */
    height: 32px; /* changed from 0.8em */
    border-radius: 0%; /* optional for circular button */
    text-align: center;
    font-weight: bold;
    font-size: 1em; /* or adjust as needed */
    color: black;
    background: #fff;
    border: none;
    cursor: pointer;
}
.window .close:hover {
    background:#808080;
}
.window .content {
    padding:.5em;
}

Da OS

Intro

Creating apps like pro B)

How to edit style

Change wallpaper

Lazy as cat, give me some codes =)

Browser

Your browser (may not work in some browsers or work bad)

Pov: virus

Styles

Literally Windows XP!!!

Literally Windows 7!!!

Literally Windows 10!!!

have fun!