[create-theme]: Zen Key Lock

[arifomer733]

Name

Zen Key Lock

Description

A glassmorphic floating indicator showing when Caps Lock, Num Lock, or Scroll Lock is active.

Homepage

https://github.com/arifomer733/zen-key-lock-indicator

Image

https://raw.githubusercontent.com/arifomer733/zen-key-lock-indicator/refs/heads/master/zen-key-lock-indicator-screenshot.png

Type

• JSON Color Theme

Theme Styles

/* Glassmorphic Lock Indicator styles */
#zen-keylock-toast {
  position: fixed;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(22, 22, 26, 0.82) !important;
  backdrop-filter: blur(20px) saturate(1.6) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.6) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding: 8px 12px !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.45) !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  color: #ffffff !important;
  transition: opacity 0.25s ease, transform 0.25s ease !important;
}

.zen-keylock-badge {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 8px !important;
  font-weight: 500 !important;
  font-size: 11.5px !important;
}

.zen-keylock-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--zen-accent, #8ab4f8) !important;
  box-shadow: 0 0 6px var(--zen-accent, #8ab4f8);
}

Readme

# Zen Key Lock Indicator

A beautiful, theme-aware floating indicator that pops up when Caps Lock, Num Lock, or Scroll Lock is enabled.

## Features
- **Frosted Glass UI**: Fits Zen Browser's layout with fluid spring animations.
- **Corner Positions**: Position the indicator in any of the 4 screen corners via the extension's toolbar settings popup.
- **Theme-Aware**: Follows your active browser theme color automatically.

Preferences

[github-actions]

Thank you for your contribution! 🎉

Your theme has been successfully submitted. The maintainers will review it and get back to you soon.

Here are some details about your submission:

• Your theme has been requested into this PR.
• It has been created into the create-theme-2049 branch.

If you have any questions or need help, feel free to ask in the comments below or in the PR.