7.css
7.css is a CSS framework that takes semantic HTML and styles them to the Windows 7 design. It is built on top of XP.css, which is an extension of 98.CSS.
It does not ship with any JavaScript, so it is compatible with your frontend framework of choice.
📦 Installation / Usage
Directly via unpkg:
<!DOCTYPE html>
<html>
<head>
<title>7.css example</title>
<meta charset="UTF-8" />
<link rel="stylesheet" href="https://unpkg.com/7.css" />
</head>
<body>
<div class="window" style="margin: 32px; width: 250px">
<div class="title-bar">
<div class="title-bar-text">My First Program</div>
</div>
<div class="window-body">
<p>Hello, world!</p>
</div>
</div>
</body>
</html>Via npm:
npm install 7.cssThen import it as below:
import "7.css/dist/7.css";📚 Documentation / Demo
Refer to the documentation page for specific instructions on this framework's components.
🛠 Developing
Clone the repo and run npm install.
The core styles are managed in gui.
You can use npm start to start a development environment that will watch for file changes and rebuild the files, reloading your browser in the process.
You can run a build manually with npm run build. This will write to the dist/ directory.
📝 Issues, Contributing, etc.
You are so welcome to report issues, help out with contributions or whatever you could think of to improve this lovely UI framework.
⚙ Integrations
7.css has been seen adopted in the following JS framework projects by the community:
- Vue - win7-ui
- Svelte - svelte-7.css (work in progress)
📜 Changelog
Refer to Releases.