# system-css
**Repository Path**: mirrors/system-css
## Basic Information
- **Project Name**: system-css
- **Description**: System.css 是一个 CSS 库，用于构建类似于 1984-1991 年期间运行的 Apple System OS 的界面
- **Primary Language**: HTML/CSS
- **License**: MIT
- **Default Branch**: main
- **Homepage**: https://www.oschina.net/p/system-css
- **GVP Project**: No
## Statistics
- **Stars**: 3
- **Forks**: 0
- **Created**: 2022-08-15
- **Last Updated**: 2026-02-14
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
[Documentation](https://sakofchit.github.io/system.css/)
System.css is a CSS library for building interfaces that resemble Apple's System OS which ran from 1984-1991. Design-wise, not much really changed from System 1 to System 6; however, this library is based on System 6 as it was the final monochrome version of macOS.
Fortunately, this library does not use any JavaScript and is compatible with any front-end framework of your choice. Most styles can also be overwritten to allow for deeper customization.
## Getting Started
There are a couple of ways you can get started with System.css!
**Import from CDN (easiest)**
Add the following to your head tag:
```html
```
Here's some starter code to help you get started:
```html
System.css Starter
System.css
Hello world!
Search
```
**Import from [npmjs](https://www.npmjs.com/package/@sakun/system.css)**
npm i @sakun/system.css
## Developing
1. Clone the repository and run ```npm install```
2. Run ```npm start``` to start the development environment.
Everything you'll need can be found in [style.css](https://github.com/sakofchit/system.css/blob/main/style.css).
## Contributing, Credits, etc.
Thanks for checking this project out! This library was made in good fun and was largely inspired by [98.css](https://github.com/jdan/98.css). The Chicago 12pt and Geneva 9pt fonts are recreations by [@blogmywiki](https://twitter.com/blogmywiki)
System.css is still in beta! I recreated components based on Apple's Human Interface Guidelines. However, there's still a pretty good chance that I might've missed/overlooked something essential. I've also had to recreate most of the assets, which can also be found [here](https://github.com/sakofchit/system.css/tree/main/icon).
If you find a bug, consider opening an issue. If there's something that you'd like to add, please feel free to create a PR!
If you'd like to see what else I'm up to, consider following me on [Twitter](https://twitter.com/sakofchit) or checking out my [personal site](https://sakun.co) :)
## Sponsors
[](https://getcssscan.com/?ref=systemcss)
[CSS Scan](https://getcssscan.com/?ref=systemcss): The fastest and easiest way to check, copy and edit CSS