10+ 资源,助您重现复古老派用户界面!复古桌面 UI

2025-06-08

10+ 种资源可用于重建老式和复古的用户界面!

复古桌面用户界面

利用这些炫酷的用户界面资源重现您的童年或回到过去。

1.NES.css

NES.css 是 NES 风格(类似 8 位)的 CSS 框架。

替代文本


2. Amiga 工作台

Javascript Amiga Workbench 1.3.3 的外观和感觉克隆。

替代文本


3.经典 Mac

一个使用 Mac OS 8.1 界面组件的原生 CSS 复制来呈现 Web 界面的框架。该项目的名称源于 After Dark,因为 after-dark-css 启发了该框架并提供了基础的窗口布局。

替代文本


4.复古

具有图标、文件夹、窗口、任务栏和键盘快捷键的复古桌面用户界面!

GitHub 徽标 ritenv /复古桌面

基于 Vanilla JS(复古)构建的复古桌面 UI

复古桌面用户界面

具有图标、文件夹、窗口、任务栏和键盘快捷键的复古桌面用户界面!

预览

这款复古的桌面 UI建于 2012 年,其功能至今仍令我珍视。它使用原生 JS(未使用任何现代 JS 框架)构建,同时使用了 jQuery 库。所有组件:UXWindowUXIcon等均由原生 JS 编写。

前提

Retro Desktop UI 模仿了典型的桌面界面。其理念是在桌面 UI 中提供迷你应用程序,通过原生 Web 视图 (iframe) 或动态加载的模板运行。

架构

该架构于 2012 年构建,架构相当简单基础。然而,API 非常丰富且可扩展,可以在 UI 基础上创建功能强大的应用程序。

每个小应用程序都以桌面上的一个图标启动。点击该图标后,会生成一个新的窗口进程,并在其中加载……


5.CRT -AnderShell 3000

使用 CSS 和 JavaScript 的复古外观外壳。

受到 PipBoy 和老式 UNIX 终端的某种启发。

替代文本


6. Bootstrap 386

时尚、直观、强大的前端框架,可实现更快、更轻松的 Web 开发。

替代文本


7. Tui CSS

基于文本的用户界面 CSS 框架

替代文本


8.Windows 95 UI 工具包

回到过去,使用这个免费的 Windows 95 用户界面工具包来创建令人惊叹的复古网站。

替代文本


9. React 95

为您的现代 React 应用刷新了 Windows95 UI 组件。
使用 styled-components 构建 💅

替代文本


10.Windows 98 CSS

替代文本


11.网络上的 Windows 98

创建这个项目是为了提高我自己在 HTML 和 CSS3 方面的水平,并更深入地学习 jQuery 和 Babel ES6。

替代文本


12. CSS Windows 10

风格更现代但仍然超酷!!

基于 CSS / JS 的 Windows 10 UI,只是为了好玩。

替代文本


订阅我们的免费每周新闻通讯,并随时了解 GitHub 上最新、最棒的 Web 开发项目,网址为www.iainfreestone.com

如果您喜欢这篇文章,您可以在 Twitter 上关注我,我会定期发布与 HTML、CSS 和 JavaScript 相关的简短技巧。

鏂囩珷鏉ユ簮锛�https://dev.to/iainfreestone/10-resources-for-recreating-old-school-retro-user-interfaces-today-hkj
PREV
🚀GitHub 上针对 Web 开发者的 10 个热门项目 - 2022 年 2 月 11 日 zx React Awesome Reveal Mailwind Staticman 安装入门 ma​​tch-sorter find-up mande
NEXT
理解 JavaScript 闭包(轻而易举!)