Roadmap

Kelp is currently in alpha, with new features are getting added every week.

Here’s the current development roadmap. It may change over time based on user feedback and changing priorities.

Features

• Utility classes to trigger wrapping of Flexbox and Grid at certain breakpoints
• .padding-* class utilities
• .margin-* class utilities
• Move sizes into the theme files
• Reduce size of code snippets
• Update pre element background color
• Add *-space margin and padding classes
• Move layer definitions to their own CSS file
• .list-icon class for using icons instead of bullets
• Give pre elements more padding and rounder corners
• Create “cookbook” of more complex layouts
• DON’T universally remove margin on :last-child. DO remove it inside elements that require it (like .callout).
• Remove top margin from h1 headings
• Fix link styles (iOS doesn’t currently support dotted)
• Add styles for sup and sub
• Add an accessibility section to the docs
• Reduce label --gap to --size-5xs
• .skeleton needs a default background color for when prefers reduced motion is active
• Create a “Customizing” section in the docs that covers…
  • Colors
  • Theme Generator
  • Custom “builds”
  • Contributing

Components

• Card
• Tag
• Button Group
• Lightbox image gallery
• Modals (with <dialog>)
• Drawer/slideout (with <dialog>)
• Dropdown menu (with <dialog>)
• Mobile nav menu hamburger
• Hero that supports background image and background video with controls
• Listbox
• Autocomplete/typeahead
• Date picker (native type="date" good enough?)
• Connected inputs, where choosing an option shows/hides other options
• Mutually exclusively selects
• Filter list
• Show/hide email visibility
• Clipboard and Share API
• Loading icon/spinner
• Autoexpanding text area
• Dismiss (for callout-as-alerts, tags, and more)
• Toggle/switch (from checkbox?)
• On/off button
• Toast
• Tooltip/popover
• Toggle tabs
• Styled progress bar
• Subnav dropdown
• Drag-and-drop (maybe?)
• Wrapper elements for intersection and mutation observers
• Table sort & filter
• Responsive table
• Tree View
• Breadcrumbs list
• Range/slider
• Pause/play gif
• format-* components for numbers and text
• Accordions from headings
• Ajax form
• Sortable list
• Table of contents
• Header links
• Toggle password visibility
• Auto-update content on event
• Dark/light/system mode toggle
• Auto dark mode
• Nav Menu options

Tasks

• Write Tests
• Add tooling to compile CSS @import’s into combined files for performance (unminified)
• Add tooling to create combined JS file (unminified)
• See how things like forms and tables behave inside callouts
• Add FAQs to the license page
• Setup a changelog with RSS feed/email notifications