Yaml has not been the focus yet. At this point, you should stick to UI only because your mileage may vary with Yaml. In time, Yaml will be fleshed out. Right now, the view is experimental and will most likely change in the coming releases.
EDIT: See baloobs comment below.
This looks great! I canât wait to dive in. Now I have a project for the next rainy day.
Well done and thanks to all involved!
This is all there is to it. It can be fully written in YAML right now.
Sections are laid out left to right in a Z-layout.
Cards are laid out inside the columns in a section based on their order.
What does this mean for the example above?
What is the order here? Masonry inside the section or something else?
Awesome feature! Added some ideas for the future in a separate thread: Upcoming Discussion - Sections
Oh wow, Iâve been using HA for a while now and I was never able to make a dashboard that I really liked, even with using the layout-card plugin. This looks so much closer to what I imagine to be my perfect dashboard - canât wait to use it myself!
Awesome job everyone <3
Very nice! In addition to the positioning features, another reason for using grid layout card as main view wrapper in my dashboard is that I can have sticky header (and in portrait also a sticky footer). Is there any chance of combining âoldschoolâ views with sections? Or inverted, have sections also available as a card (maybe already doable with âhui-â notation?)
For now Iâll keep trying to get grid layout card inside grid layout card working to add subgrid functionality to my âgrid layout auto masonryâ script (1px auto rows with js loop that adds the height of the card as grid-row-end: span)
Amazing! Markdown as title cards, do you know my dashboard 
?
Some very first comments (knowing it is experimental):
Looking forward seeing the next iterations. 
Very much needed changes to managing UI dash boards! Kudos to the work done here.
Hopefully it is possible to have nameless sections as not everyone needs to name things to recognize what they are for.
Does a sensor graph card only take up one tile, or is just me.
I would like it if it went across the entire span of a card width.
I will congratulate the Nabu Casa team for this accomplishment, even though itâs not something I think I will ever use.
This is the cherry 
on the top of the cake ⌠Wow⌠Thanks so much guys you are Wunderbar
haha good spot ive been there.
This is absolutely lovely!!! Can not wait for this! 
Maybe later on, resizing the elements could be a suggestion along with drag and drop. 
Really fantastic news. The prior mechanism and need for tons of custom elements was too tough to bother mastering, so my dashboards look messy today. Really looking forward to this huge leap forward in UX. Big thanks to the whole team for all the work!
Yes âŚRe sizing and maybe CSS customizing ⌠Then ⌠The Chery on the Chery on the top of the cake 
Thank you for updating the dashboards. This looks very promising 
Does anybody know if the grid will be customizable, i.e. the user will be able to scale a card to be larger than one grid section?
There are cards like graphs (e.g. ApexCharts) that can be scaled to better show the relevant information.But this requires assignment to a multiple grid rows/columns.
Will this kind of grid usage (like in Thomas Lovenâs mod) be part of the HA dashboard grid concept?
Iâm really looking forward to this - great job!
It might be good though, if cards could be configured to âstretchâ in order to get all sections in a row to have equal height. In CSS-terms cards might need an area that is defined as âflex-growâ and thus would be allowed to stretch if a certain flag is set on the card by the user. A good example would be graphs, images and maps to adjust their height based on sibling sections, while having a default min-height applied.
Another cool thing would be if users would be able to configured the position of sections for each breakpoint (mobile, tablet, desktop). By using flexbox and the âorderâ CSS property, this might be doable.
edit: the cherry on top would be a âgrid sectionâ or view for expert users. So a section/view, which you can divide into n rows (and columns, defaulting to the default layout grid columns) while being able to freely merge cells. And components dragged into those cells would adjust their size accordingly (using @container CSS queries to detect if compact or wide layout should be used etc.).
In case of a grid view, breakpoints likely wonât work, but thatâs probably fine as such dashboards are mostly targeted to desktop/tablet anyway.
