CSS Snippets

Ready-made CSS you can paste into Yako's Custom CSS editor.

Open Yako settings, scroll to Custom CSS, and paste any snippet below. You can combine multiple snippets.

Hide the settings gear icon

#show-settings { display: none; }

Plain background (transparent for Zen browser)

body { background: transparent; }

Centered clock with larger size

.digital {
  font-size: 4em;
  font-weight: 200;
}

Remove text shadows

#interface {
  text-shadow: none;
}

Rounded link icons

#linkblocks li a img {
  border-radius: 50%;
}

Custom link hover effect

#linkblocks li a {
  transition: transform 0.2s;
}
#linkblocks li a:hover {
  transform: scale(1.1);
}

Compact quick links

#linkblocks {
  gap: 8px;
}
#linkblocks li a {
  padding: 8px;
}

Blur the entire interface slightly

#interface {
  backdrop-filter: blur(2px);
}

Tips

  • Use your browser's DevTools (F12) to inspect elements and find the right selectors.
  • Yako uses CSS custom properties — you can override them in your custom CSS.
  • The #interface element wraps all visible widgets.
  • Quick links live inside #linkblocks.
  • The clock is inside #time.