Skip to content
All Answers
Blog

How do I style blog category tags in Squarespace?

Blog categories in Squarespace 7.1 appear as plain text links. You can transform them into pill-shaped badges with background colors, rounded corners, and hover effects.

Target .blog-categories-list a for the category links. A subtle background with contrasting text and a hover state makes categories look clickable and polished.

.blog-categories-list a,
.blog-meta-item--categories a {
  background-color: #f0f0f0;
  color: #333 !important;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px !important;
  font-weight: 500;
  text-decoration: none !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  transition: all 0.2s ease;
}

.blog-categories-list a:hover,
.blog-meta-item--categories a:hover {
  background-color: #e63946;
  color: #ffffff !important;
}
Generate category badge styles with our Button GeneratorTry it free →

Related Questions

Blog

How do I add a sidebar to my Squarespace blog?

Blog

How do I change the blog post title size in Squarespace?

Blog

How do I hide the date on blog posts in Squarespace?

Blog

How do I style the Read More link on blog posts in Squarespace?

A little over your head?

No shame — this stuff is hard. Let the pros handle it.

Long Drive MarketingTalk to Long Drive Marketing →