ui-lab.app
React component library and design system with accessible, themeable components.

I design and build digital products with a focus on great UI — tools and interfaces that are clear, useful, and enjoyable to use.
My work blends design and development, especially around UI systems and developer-facing products. See more on my GitHub , including ui-lab.
KyzaMain Projects
Side Projects
Neovim colorscheme generator with light/dark mode and plugin support.
xeno.nvim is a minimalist colorscheme generator for Neovim that creates complete themes from color seeds rather than requiring hand-crafted palettes. It generates complete Neovim colorschemes from three seeds — background, accent, and an optional foreground. The foreground defaults to the background seed's hue and chroma, so a single background + accent pair is enough to produce a coherent theme across every highlight group. The plugin provides automatic light/dark mode support, generating cohesive color palettes and highlight groups from just color inputs.
xeno derives a full 50–950 color scale from each seed using OKLCH color space, the perceptually linear color model that ensures predictable color scaling and contrast. It automatically generates shade families with semantic numbering (foreground: 50-400, background: 500-950, accent: 50-600) and supports variation control, chroma adjustment, and custom color families.
Pass your seeds to require('xeno').theme() and set the colorscheme:
require('xeno').theme('my-theme', {
background = '#1E1E1E',
accent = '#8CBE8C',
})
vim.cmd('colorscheme my-theme')
The plugin maps colors across syntax, UI, diagnostics, and plugin highlight groups automatically. It also supports advanced color control with variation parameters, chroma adjustment, contrast modification, and custom color families.
xeno seamlessly adapts to vim.o.background changes without requiring separate theme definitions. A single theme configuration automatically generates appropriate lightness scales for both light and dark modes with contrast-aware foreground adjustment to ensure readability.
Built-in theming for 26+ plugins including Telescope, nvim-tree, bufferline, nvim-cmp, FZF-Lua, Neo-tree, Dropbar, Which-key, Gitsigns, Neogit, Diffview, Todo Comments, Trouble, Indent-blankline, Render-markdown, Markview, Navic, Glance, Grug-far, Avante, and Toggleterm. Each plugin exposes high-level options so you can tune things like selected_bg or border without touching individual highlight groups:
highlights = {
plugins = {
["nvim-telescope/telescope.nvim"] = {
bg = "@background.950",
border = "@accent.500",
},
},
}
Use color references with @accent.500, @background.800, @foreground.100 notation, with fallback to shade .500 when omitted.
Create and manage multiple distinct themes simultaneously. Generate standalone colorscheme files for distribution and reuse. Use the namespace system to create per-window theme variants. Export current theme as a standalone Lua colorscheme file.
xeno provides automatic terminal color palette generation and direct Ghostty terminal color configuration. Terminal colors automatically sync with theme palette.
Primary Users:
Typical Workflows:
Generating perceptually consistent color scales from arbitrary hex seeds required working in OKLCH rather than HSL. The trickiest part was deriving a foreground that felt natural — not just a lightened version of the background, but something with the same hue character that could shift properly between light and dark mode.
vim. API for highlighting and commandsvim.api.nvim_set_hl(), autocommand support, and namespace support