---
title: "View Transitions: Use the new attr() or match-element for the view-transition-name ?"
url: https://daily.dev/posts/view-transitions-use-the-new-attr-or-match-element-for-the-view-transition-name--ftc13xnln
source_url: https://www.bram.us/2026/06/19/view-transitions-use-the-new-attr-or-match-element-for-the-view-transition-name
type: article
source: "Bram.us"
published: 2026-06-19T21:26:58.576Z
updated: 2026-06-26T12:20:43.728Z
tags: ["css", "view-transitions"]
reading_time: 3
upvotes: 3
comments: 1
language: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# View Transitions: Use the new attr() or match-element for the view-transition-name ?

**[Bram.us](https://daily.dev/sources/bram)** · 3 min read · 3 upvotes · 1 comments

## Summary

A comparison of two CSS approaches for assigning view-transition-name values: the advanced attr() function and the newer match-element keyword. While both work for same-document view transitions, match-element has two key limitations — it doesn't work across MPA (multi-page app) navigations because element identity differs between documents, and it can't be used to uniquely target specific elements in ::view-transition-*() selectors. The attr() approach is more flexible when either of those scenarios applies.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://www.bram.us/2026/06/19/view-transitions-use-the-new-attr-or-match-element-for-the-view-transition-name>

## Community discussion

Top comments from developers on daily.dev.

**@agustinbarrientos** · 0 upvotes

> No pseudo-elements rules out a lot of useful `match-element` cases.

## Similar posts on daily.dev

- [A beginner-friendly guide to view transitions in CSS](https://daily.dev/posts/a-beginner-friendly-guide-to-view-transitions-in-css-3olqhrnhv) · MDN Blog · 4 upvotes · 0 comments
- [Cross-Document View Transitions: The Gotchas Nobody Mentions](https://daily.dev/posts/cross-document-view-transitions-the-gotchas-nobody-mentions-pe5f7amsx) · CSS-Tricks · 13 upvotes · 0 comments

---

Tags: [#css](https://daily.dev/tags/css), [#view-transitions](https://daily.dev/tags/view-transitions)

[View this post on daily.dev](https://daily.dev/posts/view-transitions-use-the-new-attr-or-match-element-for-the-view-transition-name--ftc13xnln)