quikoraSource artwork and implementation
A calendar identifies date selection, schedules, or events. Include the date or scheduled activity in the surrounding text.
Use it in an interface
Support typed dates alongside a visual picker. In booking flows, state the relevant timezone rather than assuming the icon communicates it.
The solar:calendar-line-duotone source has 10 SVG path elements and a 24 × 24 coordinate system. Its source contains stroke attributes; inspect line weight when scaling down. The preview preserves the source proportions.
Embed the original SVG as an image
This example reserves a 24-pixel box. It uses an empty alternative because visible text must convey the meaning alongside a decorative icon. For an informative standalone image, replace the empty alternative with a useful description.
<img src="/icon-file.php?prefix=solar&name=calendar-line-duotone" width="24" height="24" alt="">An SVG loaded through an image element does not inherit the surrounding page’s CSS color. To recolor it, export a customized version or use a reviewed inline SVG. Compare inline SVG and image coloring.
Check before shipping
- Preview Calendar Line Duotone at the actual display size, especially if your output differs from its 24 × 24 source grid.
- Give interactive controls an action label rather than relying on the file name.
- Retain the CC BY 4.0 license notices required by the original source terms.
Try our visual implementation examples for buttons, sizing and selected states.