Lucide-based icon system for Boundary Framework.
Provides inline SVG icons that work seamlessly with Hiccup. Icons are ISC-licensed from https://lucide.dev/
Usage: (icon :home) (icon :users {:size 20 :class "text-primary"}) (icon :chevron-right {:stroke-width 2.5})
Available icons can be listed with (available-icons)
Lucide-based icon system for Boundary Framework.
Provides inline SVG icons that work seamlessly with Hiccup.
Icons are ISC-licensed from https://lucide.dev/
Usage:
(icon :home)
(icon :users {:size 20 :class "text-primary"})
(icon :chevron-right {:stroke-width 2.5})
Available icons can be listed with (available-icons)(available-icons)Returns a sorted vector of all available icon names.
Example: (available-icons) => [:alert-circle :arrow-down :arrow-up ...]
Returns a sorted vector of all available icon names. Example: (available-icons) => [:alert-circle :arrow-down :arrow-up ...]
(brand-logo)(brand-logo opts)Render the Boundary brand logo with automatic light/dark theme switching.
Uses CSS to show the appropriate logo variant based on the current theme. In light mode, shows the dark logo (dark text on light background). In dark mode, shows the light logo (light text on dark background).
Args: opts: Optional map with: :size - Height in pixels (default 32, max-width auto-scales) :class - Additional CSS classes :variant - :full (default) or :icon for icon-only version
Returns: Hiccup span with both logo images, CSS controls visibility
Example: (brand-logo) (brand-logo {:size 40 :class "sidebar-logo"}) (brand-logo {:variant :icon})
Render the Boundary brand logo with automatic light/dark theme switching.
Uses CSS to show the appropriate logo variant based on the current theme.
In light mode, shows the dark logo (dark text on light background).
In dark mode, shows the light logo (light text on dark background).
Args:
opts: Optional map with:
:size - Height in pixels (default 32, max-width auto-scales)
:class - Additional CSS classes
:variant - :full (default) or :icon for icon-only version
Returns:
Hiccup span with both logo images, CSS controls visibility
Example:
(brand-logo)
(brand-logo {:size 40 :class "sidebar-logo"})
(brand-logo {:variant :icon})(icon icon-name)(icon icon-name opts)Render a Lucide icon as inline SVG Hiccup.
Args: icon-name: Keyword icon name (e.g., :home, :users, :settings) opts: Optional map with: :size - Width/height in pixels (default 24) :class - Additional CSS classes :stroke-width - SVG stroke width (default 2) :color - Icon color (default 'currentColor') :aria-label - Accessibility label
Returns: Hiccup SVG vector, or nil if icon not found
Examples: (icon :home) (icon :users {:size 20}) (icon :settings {:class "text-primary" :size 16}) (icon :edit {:aria-label "Edit user" :stroke-width 2.5})
Render a Lucide icon as inline SVG Hiccup.
Args:
icon-name: Keyword icon name (e.g., :home, :users, :settings)
opts: Optional map with:
:size - Width/height in pixels (default 24)
:class - Additional CSS classes
:stroke-width - SVG stroke width (default 2)
:color - Icon color (default 'currentColor')
:aria-label - Accessibility label
Returns:
Hiccup SVG vector, or nil if icon not found
Examples:
(icon :home)
(icon :users {:size 20})
(icon :settings {:class "text-primary" :size 16})
(icon :edit {:aria-label "Edit user" :stroke-width 2.5})(icon-button icon-name {:keys [label size class] :or {size 20}})Render an icon inside a button-friendly wrapper with accessibility support.
Args: icon-name: Keyword icon name opts: Map with :label (for accessibility), :size, :class
Returns: Hiccup span with icon and sr-only label
Example: (icon-button :edit {:label "Edit user" :size 20})
Render an icon inside a button-friendly wrapper with accessibility support.
Args:
icon-name: Keyword icon name
opts: Map with :label (for accessibility), :size, :class
Returns:
Hiccup span with icon and sr-only label
Example:
(icon-button :edit {:label "Edit user" :size 20})(theme-toggle-button)(theme-toggle-button opts)Render a theme toggle button with sun/moon icons.
The button automatically switches between light and dark mode using the ThemeManager JavaScript module loaded via theme.js.
Args: opts: Optional map with: :class - Additional CSS classes :size - Icon size in pixels (default 20)
Returns: Hiccup button with theme toggle functionality
Example: (theme-toggle-button) (theme-toggle-button {:class "header-action" :size 22})
Render a theme toggle button with sun/moon icons.
The button automatically switches between light and dark mode using
the ThemeManager JavaScript module loaded via theme.js.
Args:
opts: Optional map with:
:class - Additional CSS classes
:size - Icon size in pixels (default 20)
Returns:
Hiccup button with theme toggle functionality
Example:
(theme-toggle-button)
(theme-toggle-button {:class "header-action" :size 22})cljdoc builds & hosts documentation for Clojure/Script libraries
| Ctrl+k | Jump to recent docs |
| ← | Move to previous article |
| → | Move to next article |
| Ctrl+/ | Jump to the search field |