https://github.com/Laaouatni/w11CSS
Windows 11 UI WEB-BASED. works directly on your Browser! made by Laaouatni. Using only HTML, CSS and Vanilla Javascript (No Framework)
https://github.com/Laaouatni/w11CSS
animation css-animations css-flexbox css-grid css-grid-layout microsoft-windows operating-system os w11 w11-clone windows-11 windows-11-clone windows-11-web windows-11-web-clone windows-clone windows-desktop windows11 windows11-darkmode windows11-recreation windows11-web
Last synced: 21 days ago
JSON representation
Windows 11 UI WEB-BASED. works directly on your Browser! made by Laaouatni. Using only HTML, CSS and Vanilla Javascript (No Framework)
- Host: GitHub
- URL: https://github.com/Laaouatni/w11CSS
- Owner: Laaouatni
- License: mit
- Created: 2021-11-27T16:10:07.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-12-05T16:10:17.000Z (5 months ago)
- Last Synced: 2025-03-29T19:06:36.851Z (26 days ago)
- Topics: animation, css-animations, css-flexbox, css-grid, css-grid-layout, microsoft-windows, operating-system, os, w11, w11-clone, windows-11, windows-11-clone, windows-11-web, windows-11-web-clone, windows-clone, windows-desktop, windows11, windows11-darkmode, windows11-recreation, windows11-web
- Language: HTML
- Homepage: https://w11-clone.vercel.app
- Size: 2.72 MB
- Stars: 107
- Watchers: 4
- Forks: 24
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Windows 11 CSS
> thanks for the ⭐ stars...
>
the code isn't the best, I know but unfortunately,
>
> I won't edit this repo, to keep it simple for junior devs (like I was 2 years ago)
>
because if is starred a lot I think is good as it is.
>
> sorry *(you can change it if you want to, to make it even better)*
### online website
-----
### User Interface
-----
## table of contents
- [Windows 11 Clone](#windows-11-clone)
- [LINK website](#online-website-w11-clone)
- [Image of Windows 11 Clone](#user-interface)
- [table of contents](#table-of-contents)
- [on mouse_move, it will create a dinamic selection drag](#new-feature-on-mouse_move-it-will-create-a-dinamic-selection-drag)
- [START MENU](#start-menu-with-animations)
- [static image](#static-image-of-start-menu-windows-11)
- [gif animation](#gif-of-the-animation-on-start-menu-windows-11)
- [WIDGET section](#widget-taskbar-section-of-windows-11)
- [static image](#static-image-of-widget-section-when-is-active-windows-11)
- [gif animation](#gif-of-the-animation-on-widget-section-windows-11)
- [CREATE NEW WINDOW on click](#create-new-windows-tab-on-click-of-any-icon)
- [static image](#static-image-of-new-tab-when-generated-windows-11)
- [gif animation](#gif-of-the-animation-of-new-tab-when-generated-windows-11)
- [MOVABLE and RESIZABLE window](#movable-and-resizable-tab-window)
- [static image](#static-image-of-movable-and-resizable-tab-window-windows-11)
- [gif animation](#gif-with-animation-of-this-functionality)
- [MOVABLE window functionality](#movable-window-functionality-onmousemove)
- [RESIZABLE window functionality](#resize-window-functionality-without-using-javascript)
- [SNAP FUNCTIONALITY](#windows-11-snap-functionality)
- [LEFT snap](#left-snap)
- [static image](#static-image-of-left-snap-functionality)
- [gif animation](#animated-gif-of-left-snap-functionality)
- [RIGHT snap](#right-snap)
- [static image](#static-image-of-right-snap-functionality)
- [FULL_SCREEN snap](#all_screen-snap)
- [static image](#static-image-of-full_screen-snap-functionality)
- [gif animation ](#animated-gif-of-full_screen-snap-functionality)
- [if window minimized, the icon is in NavBar (all this is centered automatically)](#if-window-minimized-the-icon-is-in-navbar-all-this-is-centered-automatically)
- [static image](#static-image)
- [gif animation](#gif-animation)
-----
### ✅NEW FEATURE: on mouse_move, it will create a dinamic selection drag
### Start Menu (with Animations)
###### static image of START menu (windows 11)
###### gif of the animation on START menu (Windows 11)
-----
### Widget TaskBar Section of windows 11
###### static image of WIDGET section when is Active (windows 11)
###### gif of the animation on WIDGET section (Windows 11)
-----
### create new windows tab on click of any icon
###### static image of new tab when generated (Windows 11)
###### gif of the animation of new tab when generated (Windows 11)
-----
### movable and resizable tab window
###### static image of movable and resizable tab window (Windows 11)
#### gif with animation of this functionality
###### movable window functionality (onmousemove)
###### RESIZE window functionality (without using Javascript)
-----
### windows 11 snap functionality
#### **left** snap
###### static image of LEFT SNAP functionality
###### animated gif of LEFT SNAP functionality
#### **right** snap
###### static image of RIGHT SNAP functionality
#### **all_screen** snap
###### static image of FULL_SCREEN snap functionality
###### animated gif of FULL_SCREEN snap functionality
-----
### if window minimized, the icon is in NavBar (all this is centered automatically)
###### static image
###### animated gif
-----
views count started from 3 February, but the project is uploaded on december.