Text Shadow Support in Global Styles

๐ **Source:** [Text Shadow Support in Global Styles](https://make.wordpress.org/core/2026/07/23/text-shadow-support-in-global-styles/)
> [!note]+ Document Notes
> tags: [wordpress-7-1, global-styles, theme-json, typography, block-themes]
> author: WordPress Core contributors
> source: Make WordPress Core
> reference: https://make.wordpress.org/core/2026/07/23/text-shadow-support-in-global-styles/
> date created: {{date:YYYY-MM-DD}} {{time:HH:mm}}
> # ๐ท๏ธ Title: Text Shadow Support in Global Styles
<!-- deep-read:sections start -->
## ๐งญ Table of Contents
- [๐ Summary](#-summary)
- [๐ Main Content](#-main-content)
- [๐๏ธ Notes](#๏ธ-notes)
- [๐ References](#-references)
- [๐ฃ๏ธ Paraphrase](#๏ธ-paraphrase)
- [๐ฐ Newsletter](#-newsletter)
- [โ
Action Items](#-action-items)
- [๐งช Hypotheses](#-hypotheses)
- [๐ Methodology](#-methodology)
- [โ Questions](#-questions)
- [๐ฎ Future Research](#-future-research)
- [๐ก Implications](#-implications)
- [๐ง Learning Styles Assessment](#-learning-styles-assessment)
- [๐ Accessibility Assessment](#-accessibility-assessment)
- [๐ DEIB Assessment](#-deib-assessment)
- [โ
Logical Validity](#-logical-validity)
- [๐ก๏ธ DARVO Analysis](#-darvo-analysis)
- [๐ฏ Conclusion](#-conclusion)
- [๐ Refactor Appendix](#-refactor-appendix--text-shadow-support-in-global-styles)
- [๐งฐ Template Library](#-template-library)
### ๐ References
- [Text Shadow Support in Global Styles](https://make.wordpress.org/core/2026/07/23/text-shadow-support-in-global-styles/)
- [Typography feature request](https://github.com/WordPress/gutenberg/issues/47904)
- [Planned text-shadow controls and presets](https://github.com/WordPress/gutenberg/pull/79584)
## ๐ Summary
- WordPress 7.1 adds `textShadow` under `styles.typography` in `theme.json`.
- Theme authors can set text shadows globally, per block, and on elements and states such as link hover.
- The value maps directly to CSS `text-shadow`, including comma-separated multiple shadows.
- WordPress 7.1 ships only the data-model and rendering slice. Inspector controls, Global Styles UI, presets, and block support are planned for the next release.
- The main stakeholders are theme authors, block developers, designers, accessibility reviewers, and site owners. The main risk is unreadable or distracting text when shadows are applied without contrast and readability tests.
- Bottom line: themes can start declaring text shadows now, but should treat them as progressive enhancement and test every state.
## ๐ Main Content
- **Background:** Before 7.1, theme authors needed custom CSS because the block style system did not understand text shadows.
- **Smallest useful slice:** Core adds the declaration path before the control design and preset system are settled.
- **Property shape:** `styles.typography.textShadow` accepts any valid CSS `text-shadow` value. The property works at global, block, and element levels.
- **Cascade:** Block-level values override global values like other typography styles. Element states can reset shadows, including `none` on link hover.
- **Editor behavior:** Empty rich-text placeholders suppress the global shadow so the prompt remains readable. Actual content keeps the configured shadow in the editor and front end.
- **Deferred work:** The next release is expected to add controls, preset storage and custom properties, and `supports.typography.textShadow` for Paragraph and Heading.
- **Compatibility:** The change is additive. Themes that do not set the property behave as before.
## ๐๏ธ Notes
- The feature enters through `theme.json`, not the interface. That makes it available to developers before it becomes discoverable to ordinary users.
- The direct CSS value offers flexibility but lacks preset governance in this release.
- Multiple shadows can create effects that are difficult to review or keep consistent across themes.
- The placeholder reset shows that editor affordances need protection from content styles.
- Element-state support matters because a shadow that works on default text may fail on hover, focus, or changed backgrounds.
- The staged release isolates data storage and rendering from control design, which lowers decision coupling but creates a temporary developer-only phase.
## ๐ References
- [Make WordPress Core dev note](https://make.wordpress.org/core/2026/07/23/text-shadow-support-in-global-styles/)
- [Gutenberg issue 47904](https://github.com/WordPress/gutenberg/issues/47904)
- [Gutenberg PR 79584](https://github.com/WordPress/gutenberg/pull/79584)
- [MDN: text-shadow](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
## ๐ฃ๏ธ Paraphrase
- WordPress now recognizes text shadows as structured typography data instead of leaving them in custom stylesheets.
- Themes can set the property at the same levels where they set other typography values.
- Core deliberately ships a narrow first step: developers get configuration and rendering now, while user controls and presets wait.
- Theme authors gain a standard path, but they remain responsible for restraint, contrast, state testing, and fallback behavior.
## ๐ฐ Newsletter
WordPress 7.1 brings `text-shadow` into `theme.json`, which means block themes can finally set shadows globally, by block, or by element without a custom stylesheet. This is the developer-first slice: no inspector control, no preset browser, and no per-block UI yet. Enjoy the new typography knob, but remember that three glowing shadows do not automatically make a heading more readable. [Read the dev note](https://make.wordpress.org/core/2026/07/23/text-shadow-support-in-global-styles/).
## โ
Action Items
#### DevRel
- Publish restrained examples that include readability tests.
- Explain the 7.1 scope and the next-release roadmap.
- Run a theme-author lab covering global, block, and element states.
- Track adoption and accessibility defects separately.
#### OSPO
- Record the new schema field in supported platform baselines.
- Review copied shadow recipes for provenance and license.
- Encourage upstream accessibility guidance and test fixtures.
- Track theme.json schema changes across maintained products.
#### Community
- Maintainers: add tested examples and state coverage.
- Contributors: report editor/front-end mismatches with minimal theme.json files.
- Sponsors: support accessibility and visual regression work.
- Ecosystem: share examples that favor legibility over decoration.
#### WordPress
- Core: document schema, cascade, validation, and release boundaries.
- Core Performance: measure CSS output and style-engine cost for multiple shadows.
- Core AI: stop generated designs from adding unreadable decorative shadows by default.
- Core Program Team: track the dependency chain from schema to presets, controls, docs, and accessibility review.
- Mobile: confirm rendering and editing parity or document limits.
- Playground: host a theme.json typography lab.
- Community: include the feature in block-theme developer sessions.
- Training: teach progressive enhancement and state testing.
- Marketing: present it as a developer capability in 7.1, not a complete user control.
- Support: document how to remove or override an unreadable shadow.
- Design: define sensible control ranges and preset previews.
- Documentation: add schema examples and the list of deferred features.
- Photos: no direct action.
- TV: caption a short Global Styles demo.
- Polyglots: test controls and labels once the UI arrives.
- Accessibility: test contrast, blur, cognitive load, hover, focus, zoom, and forced-colors behavior.
- Meta: avoid decorative shadows on high-density administrative text.
- CLI: expose schema validation and theme.json linting examples.
- Hosting: include 7.1 theme.json validation in staging checks.
- Tide: consider checks for extreme or unreadable shadow values only if false positives stay low.
- Openverse: test captions and attribution text under inherited global shadows.
- Themes: review global inheritance and reset sensitive components.
- Plugins: honor theme.json output without duplicating conflicting CSS.
#### The WPCC
- Fund a small accessible typography recipe library.
- Support shared theme.json test fixtures across theme projects.
### FAIR
- Keep text-shadow settings in portable theme metadata.
- Document schema versions and fallback behavior.
- Publish accessibility expectations for distributed theme packages.
## ๐งช Hypotheses
- Data-model
<!-- deep-read:sections end -->
๐ **Full text:** [[Full Document Contents/Articles/Text Shadow Support in Global Styles.md|Text Shadow Support in Global Styles by WordPress Core contributors]]
## Highlights
- WordPress 7.1 introduces the ability to define a `text-shadow` value in Global Styles through `theme.json`. Themes can now set a text shadow globally, on specific blocks, and on elements such as links, without a plugin or custom stylesheet. ([View Highlight](https://read.readwise.io/read/01ky7rkcyrrm8wff4c0av3h67c))
- Note: Text shadows enter the Global Styles data model.
- Tags: theme-json, atom/literature/h1
- Fully implementing text shadow raises questions that still need discussion, such as the right control for editing shadows and whether shadows should be stored as presets. To make progress without waiting on those decisions, this release adds the smallest useful piece: the ability to declare a `text-shadow` value directly in `theme.json`. ([View Highlight](https://read.readwise.io/read/01ky7rkeexh3gdd9jpnkw9gqan))
- Note: The feature ships in a narrow data-model-first slice.
- Tags: theme-json, atom/literature/h2