Site logo

Drifting Paper Boat Lab

Hey CSS - A CSS Style Showcase Collection

Hey CSS - A CSS Style Showcase Collection

Open Source
CSSDeveloper

Hey CSS is a style collection tool that provides rich predefined CSS effect showcases and convenient code reuse functionality. It not only includes common shadow effects but also extends various practical styles to help developers quickly build beautiful user interfaces.

What is this?

Hey CSS is a CSS style collection tool. It provides rich predefined CSS effect showcases, including shadows, gradients, animations and more practical styles, helping developers quickly reuse code and build beautiful user interfaces.

Why I Built This?

At work, I often need to find some uncommon CSS styles to achieve special effects, such as layout borders, shadows, gradients, etc.

I often use CssScan to find these styles, but it doesn't quite match my usage logic, and these styles aren't organized very clearly. To better organize and customize some CSS styles, I referenced it and wrote this tool.

Now, I can completely define and manage these styles in JSON format, without having to manually search and organize them. The syntax is also very simple—just use pseudo-classes and CSS nesting styles in JSON, and you can nicely reproduce the style code.

Core Features

  • Effect Showcase - Real-time preview of various CSS effect visual presentations
  • One-click Copy - Click to copy CSS code to clipboard
  • Continuous Updates - Constantly collecting and adding new practical styles

What Problem Does It Solve?

When needing to quickly apply basic UI effects in early development, writing CSS from scratch is time-consuming. Hey CSS provides ready-to-use style code, improving development efficiency.