Silicon

silicon - a classless, responsive CSS framework with a light and dark mode.

Generate Convert Improve

Install / Use

/learn @tygzy/Silicon

About this skill

Quality Score

0/100

README

Silicon

Silicon is a stylesheet with no requirement for classes, a light and dark mode, responsive, but also has classes to allow for some minor customization. This allows anyone to have a website with a modern design that works on desktop, tablet or mobile device without having to worry about design decisions, but if you do want to be able to, you could.

Visit https://silicon-css.com for a live preview of silicon on a website.

Speed

Silicon is 13kb in size, making it a very fast css stylesheet to load, so it won't slow down your page when loading the resources.

Standard version: silicon.min.css
Dark theme only version: silicon_dark.min.css
Light theme only version: silicon_light.min.css

Usage

After downloading silicon, use this code snippet to use it:

<!DOCTYPE html>
<html>
    <head>
        <link rel='stylesheet' href='silicon.min.css'/>
        <!--    allows responsive design    -->
        <meta name='viewport' content='width=device-width, initial-scale=1.0'/>
    </head>
</html>

The standard (non-minified) version is also included with css variables at the top of the file to allow some core level customization to colours, border width and other things.

light theme example

dark theme example

Related Skills

node-connect

351.8k

Diagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps

frontend-design

110.9k

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

openai-whisper-api

351.8k

Transcribe audio via OpenAI Audio Transcriptions API (Whisper).

qqbot-media

351.8k

QQBot 富媒体收发能力。使用 <qqmedia> 标签，系统根据文件扩展名自动识别类型（图片/语音/视频/文件）。