Automatically applies a basic structure to your component sets (variants) which can be customised to your liking. --- Manual Mode Rows & Columns Decide whether the variants for a particular property should be arranged horizontally or vertically. Order of values You can rearrange each of the v...
React Native Sortables | Sortables
What is React Native Sortables?
Sort Layers
Sort layers by name or position. Fund my work on Figma plugins → Sort Layers by Name Sort the selected layers in alphabetical order. Sort Layers by X Position Sort the selected layers by their X position. Sort Layers by Y Position Sort the selected layers by their Y position. Smart Sort Laye...
GRID: A simple visual cheatsheet for CSS Grid Layout
Learn all about the properties available in CSS Grid Layout through simple visual examples.
Unsortable — Headless, Flexible Drag-and-Drop Library
Unsortable is a lightweight, headless JavaScript library for nested drag-and-drop sorting with full state control and no DOM mutations.
Cosmik Lab Notes 003: Semble Updates - Discover, Collection Preview, Sorting, and more - Cosmik Labs
An overview of some recent enhancements to Semble (with a poll for next features!)
Overlay Composition Using Bubble Tea - Leon Mika
Working on a new feature for Dynamo-Browse which will allow the user to modify the columns of the table: move them around, sort them, hide them, etc. I want …
Component Description Manager
Manage description of all your components in one place! Each main component (and its variants) can have a description that might be useful for you, other designers and developers. Descriptions can provide tips for using particular component, important dev notes or act as tags for better searchin...
Components.build
An open standard for building modern, composable and accessible UI components.
Sort Your Friends
How well do you know your Bluesky mutuals? Drag to sort them by the numbers.
Selection Variants
View and control all nested variants and component properties in selection. Switch between variants without clicking through to find all the nested instances. Reduce the complexity of your design system by creating nested variants! Or simply use the to switch variants in bulk by selecting multipl...
Columnar Storage is Normalization
Something I didn't understand for a while is that the process of turning row-oriented data into column-oriented data isn't a totally bespoke, foreign concept...
Get Grid Information using pure CSS
With a few lines of code, you can get the number of columns, number of rows, and item coordinates
TanStack Table
Supercharge your tables or build a datagrid from scratch for TS/JS, React, Vue, Solid, Svelte, Qwik, Angular, and Lit while retaining 100% control over markup and styles.
Multiple-column layout, rows, rules, and floats
Recently implemented in Chrome are two of my top asks for CSS—the concept of rows in multiple-column layout, and gap decorations for rows and columns in grid, flexbox, and multicol. Rows (using column-wrap) provide a way to use multicol on the web without risking scrolling up and down to read if the columns become taller than the viewport. Gap decorations mean that, for multicol, you can now add a rule between these new rows. This post is a collection of the things I think would be interesting to do in future. If you think so too, and particularly if you have a great use case for any of these, let me know in the comments.
Organize Layers
Organizes all layers on the current page based on layer name; useful for organizing a page of components. Optionally customize how layers are grouped, and set the space between layers. Fund my work on Figma plugins →