Border hover effect #4

Activity

1. bejarcode

   added a commit that references this issue on Jul 18, 2026

   feat(core): v1.3.0 - packaging fixes, CSS-variable border hover, dev …

   ...

   a4f5f78
2. bejarcode commented on Jul 19, 2026

   

   bejarcode

   on Jul 19, 2026

   Owner

   More actions

   Thanks for the request! This shipped in v1.3.0. Border hover effects work with plain CSS custom properties, no JavaScript needed:

   .my-button:hover {
     --ck-border-color: #8b5cf6;  /* border color on hover */
     --ck-background: #1e293b;    /* optional: background on hover */
   }

   The values you configure in border: { ... } remain the defaults whenever the variables aren't set. You can also animate the change with .cornerkit-border path { transition: stroke 0.15s }.

   • Docs: Hover Effects with CSS Variables
   • Live demo: Hover Effects card in the gallery

   npm install @cornerkit/core@1.3.0
3. bejarcode commented on Jul 19, 2026

   

   bejarcode

   on Jul 19, 2026

   Owner

   More actions

   Hey @CodeCuration, following up to make sure you saw this land. Border hover effects are fully released now:

   • Core: @cornerkit/core@1.3.1
   • Framework packages too: @cornerkit/react, @cornerkit/vue, and @cornerkit/svelte are all on 1.1.0, so the hover CSS variables work there with no extra setup (hover is pure CSS, so it just works alongside the border prop).

   There's a live "Hover Effects" card in the demo gallery if you want to see it: https://bejarcode.github.io/cornerKit/#gallery

   Let me know if it does what you needed and I'll close this out. Thanks for the nudge, it turned into a genuinely nice feature.