see all toolsText Case ConverterWord CounterLorem Ipsum GeneratorJSON FormatterBase64 Encoder / DecoderURL Encoder / DecoderUUID GeneratorPassword GeneratorCSS Gradient GeneratorBox Shadow GeneratorColor ConverterImage ConverterImage CompressorPopup Modal LibraryDocsweb design services

v3.2 — Single file · Dark mode · RTL ready

Build faster with ShailStack

A minimalist CSS utility library — intuitive class names, no bloated frameworks, zero setup. One CDN link and you're ready.

~12 KBGzipped

600+CSS classes

46Components

0Dependencies

Get started View docs

✓ No install✓ No build step✓ Works everywhere✓ Dark mode built-in

🚀 ShailStack v3.2 is live — single file, 46 components, dark mode, RTL, WCAG AA accessible | Try it: <link rel="stylesheet" href="https://cdn.shailstack.com/shailstack.css">

Quick start

Include via CDN

No npm. No build step. Drop these lines into your HTML <head> and start using ShailStack instantly.

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap" rel="stylesheet">

<link rel="stylesheet" href="https://cdn.shailstack.com/shailstack.css" />

<script src="https://cdn.shailstack.com/shailstack.js" defer></script>

CSS downloaded by visitors (gzipped)

Bootstrap 5

~31 KB

Plus a separate JS bundle

Tailwind

Varies

Needs a build step

ShailStack

~12 KB

Just one CDN link

Live examples

See ShailStack in action

Every class does one thing. Combine them freely — no custom CSS needed.

Styled button

Use .ss-btn, .ss-btn-primary, .ss-btn-lg to style any button in one line.

Modal example

Build beautiful modals with .ss-modal, .ss-modal-box, and .ss-modal-header.

Responsive card

Use .ss-card, .ss-card-hover, and .ss-rounded-lg for consistent card layouts.

Card preview using ShailStack

Utility stack

Combine .ss-flex, .ss-gap-3, and .ss-items-center for any layout.

Item 1Item 2Item 3

Reference

How ShailStack utility classes work

Atomic classes that do one thing — combine them to build anything, without writing a single line of custom CSS.

Spacing

Use .ss-mt-4, .ss-p-6, .ss-mb-8 for consistent margin and padding on any element.

Text & font

Control size with .ss-text-xl, weight with .ss-font-bold, and alignment with .ss-text-center.

Layout

Build grids instantly with .ss-grid-3, .ss-grid-auto, and responsive prefixes like .ss-xs-grid-1.

Flexbox

Use .ss-flex, .ss-items-center, and .ss-justify-between for any flexible layout.

Visual styling

Add polish with .ss-rounded-lg, .ss-shadow, and .ss-hover-lift for hover effects.

Display helpers

Toggle visibility with .ss-hidden, .ss-block, and responsive helpers like .ss-xs-hidden.

Border utilities

Apply borders with .ss-border, .ss-border-t, and color with .ss-border-primary.

Button styling

Style with .ss-btn-primary, .ss-btn-outline, .ss-btn-ghost, or .ss-btn-lg.

Color utilities

Apply text color with .ss-text-primary and background with .ss-bg-primary, .ss-bg-danger-light.

.ss-bg-primary.ss-bg-success.ss-bg-gray

Why us

Why choose ShailStack?

Built by a developer, for developers. Every decision is about saving your time and reducing complexity.

Framework

Accelerate development

A concise class-based system that cuts CSS effort. Build modern layouts quickly — perfect for agile projects and MVPs.

Read the docs

Framework

Built for consistency

From spacing to typography, one unified design system across every component — ideal for scalable apps and UI kits.

See the tokens

Framework

Developer friendly

Intuitive class names, zero setup. One CDN link works in React, Vue, WordPress or plain HTML.

Get started

Service

Custom web development

Need a website? We build fast, modern sites with React, WordPress and more — tailored to your business.

Hire us

Service

Web & UI/UX design

Clean, responsive designs that convert: landing pages, dashboards and component libraries.

See services

Service

Speed, SEO & maintenance

We fix bugs, improve Core Web Vitals and SEO, and keep your site healthy for the long term.

Fix my site

Also from ShailStack

Free tools for developers & designers

Private, fast and free — every tool runs in your browser, so your text and files never leave your device.

AI Visibility CheckerSee if ChatGPT, Gemini, Perplexity & Google AI can find, read and quote your page — with fixes.Open tool Exam Photo & Signature ResizerResize photo & signature to the exact size and KB for SSC, UPSC, IBPS, RRB, NEET, PAN.Open tool Compress PDFMake PDFs smaller — or under 100 KB, 200 KB, 500 KB for form uploads.Open tool Merge PDFCombine several PDFs into one file, in the order you choose.Open tool JPG to PDFTurn photos and scans into one PDF — A4, Letter or image size.Open tool Image ConverterConvert JPG, PNG, WebP and more — or turn images into PDF.Open tool Image CompressorShrink JPG, PNG and WebP file size right in your browser.Open tool Text Case ConverterChange text to UPPERCASE, lowercase, Sentence or Title Case in one click.Open tool JSON FormatterBeautify, minify and validate JSON with clear error messages.Open tool

Browse all tools →

Free forever · No sign-up

Start building with ShailStack today

One CDN link. No build step. Drop it into any project and ship a polished UI in minutes.

Get started free Hire us for a project

~12 KBgzipped
46components
0build steps

index.html

<head>
  <link rel="stylesheet"
    href="https://cdn.shailstack.com/shailstack.css">
</head>

<button class="ss-btn ss-btn-primary ss-btn-pill">
  Ship it 🚀
</button>

Our Clients

Trusted by teams across industries

We are proud to work with a growing network of clients from various industries. Their trust and collaboration inspire us to deliver high-quality digital solutions tailored to their needs.

10+

Happy clients

20+

Projects delivered

100%

Satisfaction rate

Your brand

Want to work with us? Get in touch