icon

Icon helpers for Lucide icons in Basecoat UIs.

Basecoat uses Lucide icons: https://lucide.dev

Anatomy

icon: render an icon placeholder element
init: load Lucide via ESM (bundler/import map)
register_cdn: load Lucide via CDN (no bundler)

Recipes

import glaze/basecoat/icon

icon.icon("plus", [])

import glaze/basecoat/icon

html.head([], [
  // Prefer a pinned version in real projects.
  icon.register_cdn("latest"),
])

References

Lucide icon list: https://lucide.dev/icons
Lucide package guide: https://lucide.dev/guide/packages/lucide

Values

alert_circle

</>

pub fn alert_circle(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

alert_triangle

</>

pub fn alert_triangle(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

arrow_left

</>

pub fn arrow_left(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

arrow_right

</>

pub fn arrow_right(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

bold

</>

pub fn bold() -> attribute.Attribute(a)

calendar

</>

pub fn calendar(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

check

</>

pub fn check(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

check_circle

</>

pub fn check_circle(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

chevron_down

</>

pub fn chevron_down(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

chevron_left

</>

pub fn chevron_left(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

chevron_right

</>

pub fn chevron_right(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

chevron_up

</>

pub fn chevron_up(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

clock

</>

pub fn clock(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

copy

</>

pub fn copy(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

download

</>

pub fn download(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

edit

</>

pub fn edit(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

external_link

</>

pub fn external_link(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

eye

</>

pub fn eye(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

eye_off

</>

pub fn eye_off(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

facebook

</>

pub fn facebook(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

file

</>

pub fn file(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

filter

</>

pub fn filter(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

folder

</>

pub fn folder(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

github

</>

pub fn github(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

grid

</>

pub fn grid(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

heart

</>

pub fn heart(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

home

</>

pub fn home(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

icon

</>

pub fn icon(
  name: String,
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

Render a Lucide icon by name.

Use the icon name from lucide.dev/icons.

Example

import glaze/basecoat/icon

icon.icon("plus", [attribute.class("size-4")])

image

</>

pub fn image(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

info

</>

pub fn info(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

init

</>

pub fn init() -> element.Element(a)

Initialize Lucide icons.

Add this script to your <head> to enable Lucide icon rendering. Requires a JS setup that can resolve import ... from "lucide".

instagram

</>

pub fn instagram(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

key

</>

pub fn key(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

link

</>

pub fn link(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

</>

pub fn linkedin(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

list

</>

pub fn list(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

loader

</>

pub fn loader(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

lock

</>

pub fn lock(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

mail

</>

pub fn mail(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

</>

pub fn menu(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

minus

</>

pub fn minus(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

moon

</>

pub fn moon(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

more_horizontal

</>

pub fn more_horizontal(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

more_vertical

</>

pub fn more_vertical(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

music

</>

pub fn music(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

normal

</>

pub fn normal() -> attribute.Attribute(a)

phone

</>

pub fn phone(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

plus

</>

pub fn plus(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

Common icons as constants for convenience.

refresh

</>

pub fn refresh(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

register_cdn

</>

pub fn register_cdn(lucide_version: String) -> element.Element(a)

Initialize Lucide icons via CDN (no bundler).

This injects Lucide’s UMD build from unpkg and runs lucide.createIcons() on DOMContentLoaded.

Lucide recommends pinning a specific version instead of using latest. See: https://lucide.dev/guide/packages/lucide

save

</>

pub fn save(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

search

</>

pub fn search(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

settings

</>

pub fn settings(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

</>

pub fn share(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

size_lg

</>

pub fn size_lg() -> attribute.Attribute(a)

size_md

</>

pub fn size_md() -> attribute.Attribute(a)

size_sm

</>

pub fn size_sm() -> attribute.Attribute(a)

size_xl

</>

pub fn size_xl() -> attribute.Attribute(a)

size_xs

</>

pub fn size_xs() -> attribute.Attribute(a)

Common icon sizes for convenience.

sort

</>

pub fn sort(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

star

</>

pub fn star(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

sun

</>

pub fn sun(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

thin

</>

pub fn thin() -> attribute.Attribute(a)

Stroke width variants.

thumbs_down

</>

pub fn thumbs_down(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

thumbs_up

</>

pub fn thumbs_up(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

trash

</>

pub fn trash(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

twitter

</>

pub fn twitter(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

unlock

</>

pub fn unlock(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

upload

</>

pub fn upload(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

user

</>

pub fn user(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

video

</>

pub fn video(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

x

</>

pub fn x(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

x_circle

</>

pub fn x_circle(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)

youtube

</>

pub fn youtube(
  attrs: List(attribute.Attribute(a)),
) -> element.Element(a)