diff --git a/docs/codegen/layout-specs.mdx b/docs/codegen/layout-specs.mdx
index 3b6e6d10ae4..a6a0dce8293 100644
--- a/docs/codegen/layout-specs.mdx
+++ b/docs/codegen/layout-specs.mdx
@@ -79,7 +79,7 @@ The following image shows the Layout Specification Lifecycle.
 
 <img src={useBaseUrl('/images/layout-spec-lifecycle.png')} alt='Layout Spec lifecycle flowchart' className="white-background" />
 
-To see all the layout features that the framework exposes, refer to the [Yoga](https://yogalayout.com/docs/) documentation.
+To see all the layout features that the framework exposes, refer to the [Yoga](https://yogalayout.dev/docs/) documentation.
 
   </TabItem>
   <TabItem value="kotlin">
@@ -141,7 +141,7 @@ The following image shows the Layout Specification Lifecycle.
 
 <img src={useBaseUrl("/images/layout-spec-lifecycle.svg")} alt="Layout Spec lifecycle flowchart" className="white-background" />
 
-To see all the layout features that the framework exposes, refer to the [Yoga](https://yogalayout.com/docs/) documentation.
+To see all the layout features that the framework exposes, refer to the [Yoga](https://yogalayout.dev/docs/) documentation.
 
   </TabItem>
 </Tabs>
diff --git a/docs/custom-layout.md b/docs/custom-layout.md
index 73df0f34948..35e4782ede1 100644
--- a/docs/custom-layout.md
+++ b/docs/custom-layout.md
@@ -4,7 +4,7 @@ title: Manual Measurement
 ---
 import useBaseUrl from '@docusaurus/useBaseUrl';
 
-Litho relies on [Yoga](https://yogalayout.com/docs/), a powerful layout engine that can create very complex UIs for layout calculations.  However, there are few exceptions where Yoga is not sufficient and you may need to implement your own measuring and layout logic.
+Litho relies on [Yoga](https://yogalayout.dev/docs/), a powerful layout engine that can create very complex UIs for layout calculations.  However, there are few exceptions where Yoga is not sufficient and you may need to implement your own measuring and layout logic.
 
 Litho provides a manual component measurement API for determining component sizes during layout creation, which enables Developers to implement dynamic logic based on component sizes.
 
diff --git a/docs/getting-started.mdx b/docs/getting-started.mdx
index dc8c2d0f040..f689a81fa1c 100644
--- a/docs/getting-started.mdx
+++ b/docs/getting-started.mdx
@@ -339,7 +339,7 @@ android_library(
 
 You can test your install by adding a view created with Litho to an activity.
 
-First, initialize `SoLoader`. Litho has a dependency on [SoLoader](https://github.com/facebook/SoLoader) to help load native libraries provided by the underlying layout engine, [Yoga](https://yogalayout.com/docs/). Your `Application` class is a good place to do this:
+First, initialize `SoLoader`. Litho has a dependency on [SoLoader](https://github.com/facebook/SoLoader) to help load native libraries provided by the underlying layout engine, [Yoga](https://yogalayout.dev/docs/). Your `Application` class is a good place to do this:
 
 ```java title="MyApplication.java"
 public class MyApplication extends Application {
@@ -388,7 +388,7 @@ Now, when you run the app you should see "Hello World!" displayed on the screen.
 
 You can test your install by adding a view created with Litho to an activity.
 
-First, initialize `SoLoader`. Litho has a dependency on [SoLoader](https://github.com/facebook/SoLoader) to help load native libraries provided by the underlying layout engine, [Yoga](https://yogalayout.com/docs/). Your `Application` class is a good place to do this:
+First, initialize `SoLoader`. Litho has a dependency on [SoLoader](https://github.com/facebook/SoLoader) to help load native libraries provided by the underlying layout engine, [Yoga](https://yogalayout.dev/docs/). Your `Application` class is a good place to do this:
 
 ```kotlin title="MyApplication.kt"
 class MyApplication: Application() {
diff --git a/docs/mainconcepts/flexbox-yoga.mdx b/docs/mainconcepts/flexbox-yoga.mdx
index 6102cbe6e78..94fa6850ede 100644
--- a/docs/mainconcepts/flexbox-yoga.mdx
+++ b/docs/mainconcepts/flexbox-yoga.mdx
@@ -7,7 +7,7 @@ import useBaseUrl from '@docusaurus/useBaseUrl';
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
-Litho uses the [Yoga](https://yogalayout.com/) library, which is an implementation of [Flexbox](https://www.w3.org/TR/css-flexbox-1/), to measure and layout on-screen components. Users familiar with Flexbox on the web should have no problems. For users familiar with how Android normally performs Layout, Flexbox will remind them of `LinearLayout`.
+Litho uses the [Yoga](https://yogalayout.dev/) library, which is an implementation of [Flexbox](https://www.w3.org/TR/css-flexbox-1/), to measure and layout on-screen components. Users familiar with Flexbox on the web should have no problems. For users familiar with how Android normally performs Layout, Flexbox will remind them of `LinearLayout`.
 
 This page shows how various attributes of Flexbox are used for on-screen layout.
 
@@ -98,4 +98,4 @@ The `YogaAlign` values, for Lines, are illustrated below.
 
 <img src={useBaseUrl('/images/litho-layout-align-content.png')} alt='align-content'/>
 
-For more information on specific Flexbox properties, refer to the [Yoga documentation](https://yogalayout.com/docs/) or explore any web resource on how Flexbox functions.
+For more information on specific Flexbox properties, refer to the [Yoga documentation](https://yogalayout.dev/docs/) or explore any web resource on how Flexbox functions.
diff --git a/docs/mainconcepts/troubleshooting.mdx b/docs/mainconcepts/troubleshooting.mdx
index 7daec0880aa..dfa5bcfe830 100644
--- a/docs/mainconcepts/troubleshooting.mdx
+++ b/docs/mainconcepts/troubleshooting.mdx
@@ -7,7 +7,7 @@ A few issues may be encountered while using flexbox. This section discusses the
 
 For debugging, the [Flipper layout inspector plugin](/docs/debugging/debugging-tips#layout-inspector-plugin) can be used to see the component hierarchy, and the flex properties can be updated in the plugin itself to understand how it affects layout.
 
-Another tool that can be used for understanding and playing around with flexbox properties is [Yoga Playground](https://yogalayout.com/playground).
+Another tool that can be used for understanding and playing around with flexbox properties is [Yoga Playground](https://yogalayout.dev/playground).
 
 ## Why is my text truncated?
 
diff --git a/docs/mainconcepts/yoga-playground.mdx b/docs/mainconcepts/yoga-playground.mdx
index 4e388077a32..3f690a5393b 100644
--- a/docs/mainconcepts/yoga-playground.mdx
+++ b/docs/mainconcepts/yoga-playground.mdx
@@ -5,7 +5,7 @@ title: Yoga Playground
 
 import useBaseUrl from '@docusaurus/useBaseUrl';
 
-The [Yoga Playground](https://yogalayout.com/playground) can be used to try different layout configurations and generate corresponding Litho code, as shown in the following screenshot.
+The [Yoga Playground](https://yogalayout.dev/playground) can be used to try different layout configurations and generate corresponding Litho code, as shown in the following screenshot.
 
 <img src={useBaseUrl('/images/yoga-playground.png')} alt='Yoga Playground' className="white-background" />
 
diff --git a/docs/tutorial.mdx b/docs/tutorial.mdx
index 180a65e9ef5..2224d6b1d32 100644
--- a/docs/tutorial.mdx
+++ b/docs/tutorial.mdx
@@ -18,7 +18,7 @@ First, initialize `SoLoader` in your `Application` class:
 ```java file=sample-barebones/src/main/java/com/facebook/samples/lithobarebones/SampleApplication.java start=app_setup_start end=app_setup_end
 ```
 
-Behind the scenes, Litho uses [Yoga](https://yogalayout.com/docs/) for layout. Yoga has native dependencies and [SoLoader](https://github.com/facebook/SoLoader) is brought in to take care of loading those. Initializing `SoLoader` here ensures that you're not referencing unloaded libraries later on.
+Behind the scenes, Litho uses [Yoga](https://yogalayout.dev/docs/) for layout. Yoga has native dependencies and [SoLoader](https://github.com/facebook/SoLoader) is brought in to take care of loading those. Initializing `SoLoader` here ensures that you're not referencing unloaded libraries later on.
 
 Next, add a predefined [Text](pathname:///javadoc/com/facebook/litho/widget/Text.html) Litho component to an activity:
 
@@ -92,7 +92,7 @@ public class ListItemSpec {
 }
 ```
 
-You should recognize the `Text` component from the previous tutorial step. In this example, you're passing it in as a `child` property of a [Column](pathname:///javadoc/com/facebook/litho/Column.html). You can think of a `Column` as equivalent to a `<div>` in HTML.  It's a wrapper, used mainly for collating things together and perhaps adding some background styling.  Since Litho uses [Yoga](https://yogalayout.com/docs/), you can add flexbox attributes to set the layout for the children of a `Column` or a `Row`. Here, you simply set the padding and the background color.
+You should recognize the `Text` component from the previous tutorial step. In this example, you're passing it in as a `child` property of a [Column](pathname:///javadoc/com/facebook/litho/Column.html). You can think of a `Column` as equivalent to a `<div>` in HTML.  It's a wrapper, used mainly for collating things together and perhaps adding some background styling.  Since Litho uses [Yoga](https://yogalayout.dev/docs/), you can add flexbox attributes to set the layout for the children of a `Column` or a `Row`. Here, you simply set the padding and the background color.
 
 How do you render this component? In your activity, simply change the `Component` definition to:
 
diff --git a/docs/tutorial/introducing-layout.md b/docs/tutorial/introducing-layout.md
index af132995b5b..fb0829f16a2 100644
--- a/docs/tutorial/introducing-layout.md
+++ b/docs/tutorial/introducing-layout.md
@@ -8,7 +8,7 @@ In this section of the tutorial, you'll become familiar with building layouts us
 
 ## Yoga and Flexbox
 
-To **measure** and **layout** on-screen components, Litho uses the [Yoga](https://yogalayout.com/) library, which is an implementation of [Flexbox](https://www.w3.org/TR/css-flexbox-1/).
+To **measure** and **layout** on-screen components, Litho uses the [Yoga](https://yogalayout.dev/) library, which is an implementation of [Flexbox](https://www.w3.org/TR/css-flexbox-1/).
 
 To learn more about Flexbox, see the [Layout System with Flexbox](../mainconcepts/flexbox-yoga.mdx) page in the 'Main Concepts' section.
 
diff --git a/docs/tutorial/project-setup.mdx b/docs/tutorial/project-setup.mdx
index 86d21088962..76aa5ff24cc 100644
--- a/docs/tutorial/project-setup.mdx
+++ b/docs/tutorial/project-setup.mdx
@@ -44,7 +44,7 @@ apply plugin: 'kotlin-kapt'
 
 ## 3. Wire up native libs
 
-Litho has a dependency on [SoLoader](https://github.com/facebook/SoLoader) to help load native libraries provided by the underlying layout engine, [Yoga](https://yogalayout.com/docs/)[^1].
+Litho has a dependency on [SoLoader](https://github.com/facebook/SoLoader) to help load native libraries provided by the underlying layout engine, [Yoga](https://yogalayout.dev/docs/)[^1].
 
 [^1]: Yoga is a cross-platform (usable on Android, iOS, and other platforms) implementation of the Flexbox layout system used in web browsers. Litho uses Yoga to enable layouts (positioning of elements in the screen) to be specified via the Flexbox layouting system.
 
diff --git a/litho-core-kotlin/src/main/kotlin/com/facebook/litho/core/CoreStyles.kt b/litho-core-kotlin/src/main/kotlin/com/facebook/litho/core/CoreStyles.kt
index 414c2f5b7a9..9a3e3e90c58 100644
--- a/litho-core-kotlin/src/main/kotlin/com/facebook/litho/core/CoreStyles.kt
+++ b/litho-core-kotlin/src/main/kotlin/com/facebook/litho/core/CoreStyles.kt
@@ -233,7 +233,7 @@ inline fun Style.padding(
 /**
  * Defines padding on the component on a per-edge basis, with a percent value of container's size.
  * See
- * [https://yogalayout.com/docs/margins-paddings-borders](https://yogalayout.com/docs/margins-paddings-borders)
+ * [https://yogalayout.dev/docs/margins-paddings-borders](https://yogalayout.dev/docs/margins-paddings-borders)
  * for more information.
  */
 inline fun Style.paddingPercent(
@@ -284,7 +284,7 @@ inline fun Style.margin(
 /**
  * Defines margin around the component on a per-edge basis, with a percent value of container's
  * size. See
- * [https://yogalayout.com/docs/margins-paddings-borders](https://yogalayout.com/docs/margins-paddings-borders)
+ * [https://yogalayout.dev/docs/margins-paddings-borders](https://yogalayout.dev/docs/margins-paddings-borders)
  * for more information.
  */
 inline fun Style.marginPercent(
diff --git a/litho-core-kotlin/src/main/kotlin/com/facebook/litho/flexbox/FlexboxStyle.kt b/litho-core-kotlin/src/main/kotlin/com/facebook/litho/flexbox/FlexboxStyle.kt
index 4d12a04e4f7..e690675b7ac 100644
--- a/litho-core-kotlin/src/main/kotlin/com/facebook/litho/flexbox/FlexboxStyle.kt
+++ b/litho-core-kotlin/src/main/kotlin/com/facebook/litho/flexbox/FlexboxStyle.kt
@@ -169,7 +169,7 @@ internal class FlexboxObjectStyleItem(
  * parent's size. Values should be from 0 to 100.
  * - See https://css-tricks.com/snippets/css/a-guide-to-flexbox/ for more documentation on flexbox
  *   properties.
- * - See https://yogalayout.com/ for a web-based playground for trying out flexbox layouts.
+ * - See https://yogalayout.dev/ for a web-based playground for trying out flexbox layouts.
  *
  * Defaults: flex-grow = 0, flex-shrink = 1, flex-basis = null, flex-basis-percent = null
  */
@@ -190,7 +190,7 @@ inline fun Style.flex(
  * property for this child.
  * - See https://css-tricks.com/snippets/css/a-guide-to-flexbox/ for more documentation on flexbox
  *   properties.
- * - See https://yogalayout.com/ for a web-based playground for trying out flexbox layouts.
+ * - See https://yogalayout.dev/ for a web-based playground for trying out flexbox layouts.
  */
 inline fun Style.alignSelf(align: YogaAlign): Style =
     this + FlexboxObjectStyleItem(FlexboxObjectField.ALIGN_SELF, align)
@@ -216,7 +216,7 @@ inline fun Style.aspectRatio(aspectRatio: Float): Style =
  * For positionType of RELATIVE: the values specified here will define how the child is positioned
  * relative to where that edge would have normally been positioned.
  *
- * See https://yogalayout.com/ for a web-based playground for trying out flexbox layouts.
+ * See https://yogalayout.dev/ for a web-based playground for trying out flexbox layouts.
  */
 inline fun Style.position(
     all: Dimen? = null,
diff --git a/litho-core/src/main/java/com/facebook/litho/Component.java b/litho-core/src/main/java/com/facebook/litho/Component.java
index a1f1a00a7df..bf8d7d8039b 100644
--- a/litho-core/src/main/java/com/facebook/litho/Component.java
+++ b/litho-core/src/main/java/com/facebook/litho/Component.java
@@ -982,7 +982,7 @@ public T accessibilityRoleDescription(@StringRes int stringId, Object... formatA
     /**
      * Controls how a child aligns in the cross direction, overriding the alignItems of the parent.
      * See <a
-     * href="https://yogalayout.com/docs/align-items">https://yogalayout.com/docs/align-items</a>
+     * href="https://yogalayout.dev/docs/align-items">https://yogalayout.dev/docs/align-items</a>
      * for more information.
      *
      * <p>Default: {@link YogaAlign#AUTO}
@@ -1010,7 +1010,7 @@ public T alpha(DynamicValue<Float> value) {
 
     /**
      * Defined as the ratio between the width and the height of a node. See <a
-     * href="https://yogalayout.com/docs/aspect-ratio">https://yogalayout.com/docs/aspect-ratio</a>
+     * href="https://yogalayout.dev/docs/aspect-ratio">https://yogalayout.dev/docs/aspect-ratio</a>
      * for more information
      */
     public T aspectRatio(float aspectRatio) {
@@ -1190,7 +1190,7 @@ public T enabled(boolean isEnabled) {
      * <p>When flex is -1, the component is normally sized according width and height. However, if
      * there's not enough space, the component will shrink to its minWidth and minHeight.
      *
-     * <p>See <a href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for
+     * <p>See <a href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for
      * more information.
      *
      * <p>Default: 0
@@ -1231,7 +1231,7 @@ public T flexBasisPercent(float percent) {
      * parent is a container with FlexDirection = column. The FlexBasis of an item is the default
      * size of that item, the size of the item before any FlexGrow and FlexShrink calculations are
      * performed. See <a
-     * href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for more
+     * href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for more
      * information.
      *
      * <p>Default: 0
@@ -1250,7 +1250,7 @@ public T flexBasisRes(@DimenRes int resId) {
      * If the sum of childrens' main axis dimensions is less than the minimum size, how much should
      * this component grow? This value represents the "flex grow factor" and determines how much
      * this component should grow along the main axis in relation to any other flexible children.
-     * See <a href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for more
+     * See <a href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for more
      * information.
      *
      * <p>Default: 0
@@ -1263,7 +1263,7 @@ public T flexGrow(float flexGrow) {
     /**
      * The FlexShrink property describes how to shrink children along the main axis in the case that
      * the total size of the children overflow the size of the container on the main axis. See <a
-     * href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for more
+     * href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for more
      * information.
      *
      * <p>Default: 1
@@ -1387,7 +1387,7 @@ public T heightPercent(float percent) {
 
     /**
      * Specifies the height of the element's content area. See <a
-     * href="https://yogalayout.com/docs/width-height">https://yogalayout.com/docs/width-height</a>
+     * href="https://yogalayout.dev/docs/width-height">https://yogalayout.dev/docs/width-height</a>
      * for more information
      */
     public T heightPx(@Px int height) {
@@ -1489,7 +1489,7 @@ public T marginPercent(@Nullable YogaEdge edge, float percent) {
     /**
      * Effects the spacing around the outside of a node. A node with margin will offset itself from
      * the bounds of its parent but also offset the location of any siblings. See <a
-     * href="https://yogalayout.com/docs/margins-paddings-borders">https://yogalayout.com/docs/margins-paddings-borders</a>
+     * href="https://yogalayout.dev/docs/margins-paddings-borders">https://yogalayout.dev/docs/margins-paddings-borders</a>
      * for more information
      */
     public T marginPx(@Nullable YogaEdge edge, @Px int margin) {
@@ -1633,7 +1633,7 @@ public T minWidthPercent(float percent) {
 
     /**
      * This property has higher priority than all other properties and will always be respected. See
-     * <a href="https://yogalayout.com/docs/min-max/">https://yogalayout.com/docs/min-max/</a> for
+     * <a href="https://yogalayout.dev/docs/min-max/">https://yogalayout.dev/docs/min-max/</a> for
      * more information
      */
     public T minWidthPx(@Px int minWidth) {
@@ -1717,7 +1717,7 @@ public T paddingPercent(@Nullable YogaEdge edge, float percent) {
     /**
      * Affects the size of the node it is applied to. Padding will not add to the total size of an
      * element if it has an explicit size set. See <a
-     * href="https://yogalayout.com/docs/margins-paddings-borders">https://yogalayout.com/docs/margins-paddings-borders</a>
+     * href="https://yogalayout.dev/docs/margins-paddings-borders">https://yogalayout.dev/docs/margins-paddings-borders</a>
      * for more information
      */
     public T paddingPx(@Nullable YogaEdge edge, @Px int padding) {
@@ -1765,7 +1765,7 @@ public T positionPercent(@Nullable YogaEdge edge, float percent) {
     /**
      * When used in combination with {@link #positionType} of {@link YogaPositionType#ABSOLUTE},
      * allows the component to specify how it should be positioned within its parent. See <a
-     * href="https://yogalayout.com/docs/absolute-relative-layout">https://yogalayout.com/docs/absolute-relative-layout</a>
+     * href="https://yogalayout.dev/docs/absolute-relative-layout">https://yogalayout.dev/docs/absolute-relative-layout</a>
      * for more information.
      */
     public T positionPx(@Nullable YogaEdge edge, @Px int position) {
@@ -1780,7 +1780,7 @@ public T positionRes(@Nullable YogaEdge edge, @DimenRes int resId) {
 
     /**
      * Controls how this component will be positioned within its parent. See <a
-     * href="https://yogalayout.com/docs/absolute-relative-layout">https://yogalayout.com/docs/absolute-relative-layout</a>
+     * href="https://yogalayout.dev/docs/absolute-relative-layout">https://yogalayout.dev/docs/absolute-relative-layout</a>
      * for more details.
      *
      * <p>Default: {@link YogaPositionType#RELATIVE}
@@ -2108,7 +2108,7 @@ public T widthPercent(float percent) {
 
     /**
      * Specifies the width of the element's content area. See <a
-     * href="https://yogalayout.com/docs/width-height">https://yogalayout.com/docs/width-height</a>
+     * href="https://yogalayout.dev/docs/width-height">https://yogalayout.dev/docs/width-height</a>
      * for more information
      */
     public T widthPx(@Px int width) {
@@ -2178,7 +2178,7 @@ protected ContainerBuilder(
      * The AlignSelf property has the same options and effect as AlignItems but instead of affecting
      * the children within a container, you can apply this property to a single child to change its
      * alignment within its parent. See <a
-     * href="https://yogalayout.com/docs/align-content">https://yogalayout.com/docs/align-content</a>
+     * href="https://yogalayout.dev/docs/align-content">https://yogalayout.dev/docs/align-content</a>
      * for more information.
      *
      * <p>Default: {@link YogaAlign#AUTO}
@@ -2189,7 +2189,7 @@ protected ContainerBuilder(
      * The AlignItems property describes how to align children along the cross axis of their
      * container. AlignItems is very similar to JustifyContent but instead of applying to the main
      * axis, it applies to the cross axis. See <a
-     * href="https://yogalayout.com/docs/align-items">https://yogalayout.com/docs/align-items</a>
+     * href="https://yogalayout.dev/docs/align-items">https://yogalayout.dev/docs/align-items</a>
      * for more information.
      *
      * <p>Default: {@link YogaAlign#STRETCH}
@@ -2205,7 +2205,7 @@ protected ContainerBuilder(
      * container. For example, you can use this property to center a child horizontally within a
      * container with FlexDirection = Row or vertically within one with FlexDirection = Column. See
      * <a
-     * href="https://yogalayout.com/docs/justify-content">https://yogalayout.com/docs/justify-content</a>
+     * href="https://yogalayout.dev/docs/justify-content">https://yogalayout.dev/docs/justify-content</a>
      * for more information.
      *
      * <p>Default: {@link YogaJustify#FLEX_START}
@@ -2223,7 +2223,7 @@ protected ContainerBuilder(
      * <p>The next line will have the same FlexDirection as the first line and will appear next to
      * the first line along the cross axis - below it if using FlexDirection = Column and to the
      * right if using FlexDirection = Row. See <a
-     * href="https://yogalayout.com/docs/flex-wrap">https://yogalayout.com/docs/flex-wrap</a> for
+     * href="https://yogalayout.dev/docs/flex-wrap">https://yogalayout.dev/docs/flex-wrap</a> for
      * more information.
      *
      * <p>Default: {@link YogaWrap#NO_WRAP}
diff --git a/litho-editor-flipper/src/main/java/com/facebook/litho/editor/flipper/DebugComponentDescriptor.java b/litho-editor-flipper/src/main/java/com/facebook/litho/editor/flipper/DebugComponentDescriptor.java
index 5b35cbfb0bd..9ea64da7ae4 100644
--- a/litho-editor-flipper/src/main/java/com/facebook/litho/editor/flipper/DebugComponentDescriptor.java
+++ b/litho-editor-flipper/src/main/java/com/facebook/litho/editor/flipper/DebugComponentDescriptor.java
@@ -311,7 +311,7 @@ private static FlipperObject getLayoutData(DebugComponent node) {
     }
 
     final FlipperObject.Builder data = new FlipperObject.Builder();
-    data.put("<PLAYGROUND>", InspectorValue.immutable("https://yogalayout.com/playground/"));
+    data.put("<PLAYGROUND>", InspectorValue.immutable("https://yogalayout.dev/playground/"));
 
     data.put("background", DataUtils.fromDrawable(layout.getBackground()));
     data.put("foreground", DataUtils.fromDrawable(layout.getForeground()));
diff --git a/website/src/pages/index.js b/website/src/pages/index.js
index 24147831fb9..cffe35450df 100644
--- a/website/src/pages/index.js
+++ b/website/src/pages/index.js
@@ -59,7 +59,7 @@ const features = [
     imageUrl: 'images/home-flat-not-flat.png',
     description: (
       <>
-        Litho uses <a href="https://yogalayout.com/docs">Yoga</a> for layout and
+        Litho uses <a href="https://yogalayout.dev/docs">Yoga</a> for layout and
         automatically reduces the number of ViewGroups that your UI contains.
         This, in addition to Litho's text optimizations, allows for much smaller
         view hierarchies and improves both memory and scroll performance.
diff --git a/website/static/javadoc/com/facebook/litho/Column.Builder.html b/website/static/javadoc/com/facebook/litho/Column.Builder.html
index 04ce55325f6..8588336bc57 100644
--- a/website/static/javadoc/com/facebook/litho/Column.Builder.html
+++ b/website/static/javadoc/com/facebook/litho/Column.Builder.html
@@ -292,7 +292,7 @@ <h4>alignContent</h4>
 <div class="block">The AlignSelf property has the same options and effect as AlignItems but instead of affecting
  the children within a container, you can apply this property to a single child to change its
  alignment within its parent. See <a
- href="https://yogalayout.com/docs/align-content">https://yogalayout.com/docs/align-content</a>
+ href="https://yogalayout.dev/docs/align-content">https://yogalayout.dev/docs/align-content</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#AUTO"><code>YogaAlign.AUTO</code></a></div>
@@ -313,7 +313,7 @@ <h4>alignItems</h4>
 <div class="block">The AlignItems property describes how to align children along the cross axis of their
  container. AlignItems is very similar to JustifyContent but instead of applying to the main
  axis, it applies to the cross axis. See <a
- href="https://yogalayout.com/docs/align-items">https://yogalayout.com/docs/align-items</a>
+ href="https://yogalayout.dev/docs/align-items">https://yogalayout.dev/docs/align-items</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#STRETCH"><code>YogaAlign.STRETCH</code></a></div>
@@ -335,7 +335,7 @@ <h4>justifyContent</h4>
  container. For example, you can use this property to center a child horizontally within a
  container with FlexDirection = Row or vertically within one with FlexDirection = Column. See
  <a
- href="https://yogalayout.com/docs/justify-content">https://yogalayout.com/docs/justify-content</a>
+ href="https://yogalayout.dev/docs/justify-content">https://yogalayout.dev/docs/justify-content</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaJustify.html#FLEX_START"><code>YogaJustify.FLEX_START</code></a></div>
@@ -360,7 +360,7 @@ <h4>wrap</h4>
  <p>The next line will have the same FlexDirection as the first line and will appear next to
  the first line along the cross axis - below it if using FlexDirection = Column and to the
  right if using FlexDirection = Row. See <a
- href="https://yogalayout.com/docs/flex-wrap">https://yogalayout.com/docs/flex-wrap</a> for
+ href="https://yogalayout.dev/docs/flex-wrap">https://yogalayout.dev/docs/flex-wrap</a> for
  more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaWrap.html#NO_WRAP"><code>YogaWrap.NO_WRAP</code></a></div>
diff --git a/website/static/javadoc/com/facebook/litho/Component.Builder.html b/website/static/javadoc/com/facebook/litho/Component.Builder.html
index c6493437897..486460f2b4e 100644
--- a/website/static/javadoc/com/facebook/litho/Component.Builder.html
+++ b/website/static/javadoc/com/facebook/litho/Component.Builder.html
@@ -1140,7 +1140,7 @@ <h4>alignSelf</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;alignSelf(<a href="../../../com/facebook/yoga/YogaAlign.html" title="enum in com.facebook.yoga">YogaAlign</a>&nbsp;alignSelf)</pre>
 <div class="block">Controls how a child aligns in the cross direction, overriding the alignItems of the parent.
  See <a
- href="https://yogalayout.com/docs/align-items">https://yogalayout.com/docs/align-items</a>
+ href="https://yogalayout.dev/docs/align-items">https://yogalayout.dev/docs/align-items</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#AUTO"><code>YogaAlign.AUTO</code></a></div>
@@ -1178,7 +1178,7 @@ <h4>alpha</h4>
 <h4>aspectRatio</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;aspectRatio(float&nbsp;aspectRatio)</pre>
 <div class="block">Defined as the ratio between the width and the height of a node. See <a
- href="https://yogalayout.com/docs/aspect-ratio">https://yogalayout.com/docs/aspect-ratio</a>
+ href="https://yogalayout.dev/docs/aspect-ratio">https://yogalayout.dev/docs/aspect-ratio</a>
  for more information</div>
 </li>
 </ul>
@@ -1432,7 +1432,7 @@ <h4>flex</h4>
  <p>When flex is -1, the component is normally sized according width and height. However, if
  there's not enough space, the component will shrink to its minWidth and minHeight.
 
- <p>See <a href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for
+ <p>See <a href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for
  more information.
 
  <p>Default: 0</div>
@@ -1506,7 +1506,7 @@ <h4>flexBasisPx</h4>
  parent is a container with FlexDirection = column. The FlexBasis of an item is the default
  size of that item, the size of the item before any FlexGrow and FlexShrink calculations are
  performed. See <a
- href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for more
+ href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for more
  information.
 
  <p>Default: 0</div>
@@ -1535,7 +1535,7 @@ <h4>flexGrow</h4>
 <div class="block">If the sum of childrens' main axis dimensions is less than the minimum size, how much should
  this component grow? This value represents the "flex grow factor" and determines how much
  this component should grow along the main axis in relation to any other flexible children.
- See <a href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for more
+ See <a href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for more
  information.
 
  <p>Default: 0</div>
@@ -1550,7 +1550,7 @@ <h4>flexShrink</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;flexShrink(float&nbsp;flexShrink)</pre>
 <div class="block">The FlexShrink property describes how to shrink children along the main axis in the case that
  the total size of the children overflow the size of the container on the main axis. See <a
- href="https://yogalayout.com/docs/flex">https://yogalayout.com/docs/flex</a> for more
+ href="https://yogalayout.dev/docs/flex">https://yogalayout.dev/docs/flex</a> for more
  information.
 
  <p>Default: 1</div>
@@ -1763,7 +1763,7 @@ <h4>heightPercent</h4>
 <h4>heightPx</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;heightPx(int&nbsp;height)</pre>
 <div class="block">Specifies the height of the element's content area. See <a
- href="https://yogalayout.com/docs/width-height">https://yogalayout.com/docs/width-height</a>
+ href="https://yogalayout.dev/docs/width-height">https://yogalayout.dev/docs/width-height</a>
  for more information</div>
 </li>
 </ul>
@@ -1931,7 +1931,7 @@ <h4>marginPx</h4>
                   int&nbsp;margin)</pre>
 <div class="block">Effects the spacing around the outside of a node. A node with margin will offset itself from
  the bounds of its parent but also offset the location of any siblings. See <a
- href="https://yogalayout.com/docs/margins-paddings-borders">https://yogalayout.com/docs/margins-paddings-borders</a>
+ href="https://yogalayout.dev/docs/margins-paddings-borders">https://yogalayout.dev/docs/margins-paddings-borders</a>
  for more information</div>
 </li>
 </ul>
@@ -2255,7 +2255,7 @@ <h4>minWidthPercent</h4>
 <h4>minWidthPx</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;minWidthPx(int&nbsp;minWidth)</pre>
 <div class="block">This property has higher priority than all other properties and will always be respected. See
- <a href="https://yogalayout.com/docs/min-max/">https://yogalayout.com/docs/min-max/</a> for
+ <a href="https://yogalayout.dev/docs/min-max/">https://yogalayout.dev/docs/min-max/</a> for
  more information</div>
 </li>
 </ul>
@@ -2386,7 +2386,7 @@ <h4>paddingPx</h4>
                    int&nbsp;padding)</pre>
 <div class="block">Affects the size of the node it is applied to. Padding will not add to the total size of an
  element if it has an explicit size set. See <a
- href="https://yogalayout.com/docs/margins-paddings-borders">https://yogalayout.com/docs/margins-paddings-borders</a>
+ href="https://yogalayout.dev/docs/margins-paddings-borders">https://yogalayout.dev/docs/margins-paddings-borders</a>
  for more information</div>
 </li>
 </ul>
@@ -2482,7 +2482,7 @@ <h4>positionPx</h4>
                     int&nbsp;position)</pre>
 <div class="block">When used in combination with <a href="../../../com/facebook/litho/Component.Builder.html#positionType-com.facebook.yoga.YogaPositionType-"><code>positionType(com.facebook.yoga.YogaPositionType)</code></a> of <a href="../../../com/facebook/yoga/YogaPositionType.html#ABSOLUTE"><code>YogaPositionType.ABSOLUTE</code></a>,
  allows the component to specify how it should be positioned within its parent. See <a
- href="https://yogalayout.com/docs/absolute-relative-layout">https://yogalayout.com/docs/absolute-relative-layout</a>
+ href="https://yogalayout.dev/docs/absolute-relative-layout">https://yogalayout.dev/docs/absolute-relative-layout</a>
  for more information.</div>
 </li>
 </ul>
@@ -2508,7 +2508,7 @@ <h4>positionRes</h4>
 <h4>positionType</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;positionType(<a href="../../../com/facebook/yoga/YogaPositionType.html" title="enum in com.facebook.yoga">YogaPositionType</a>&nbsp;positionType)</pre>
 <div class="block">Controls how this component will be positioned within its parent. See <a
- href="https://yogalayout.com/docs/absolute-relative-layout">https://yogalayout.com/docs/absolute-relative-layout</a>
+ href="https://yogalayout.dev/docs/absolute-relative-layout">https://yogalayout.dev/docs/absolute-relative-layout</a>
  for more details.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaPositionType.html#RELATIVE"><code>YogaPositionType.RELATIVE</code></a></div>
@@ -3009,7 +3009,7 @@ <h4>widthPercent</h4>
 <h4>widthPx</h4>
 <pre>public&nbsp;<a href="../../../com/facebook/litho/Component.Builder.html" title="type parameter in Component.Builder">T</a>&nbsp;widthPx(int&nbsp;width)</pre>
 <div class="block">Specifies the width of the element's content area. See <a
- href="https://yogalayout.com/docs/width-height">https://yogalayout.com/docs/width-height</a>
+ href="https://yogalayout.dev/docs/width-height">https://yogalayout.dev/docs/width-height</a>
  for more information</div>
 </li>
 </ul>
diff --git a/website/static/javadoc/com/facebook/litho/Component.ContainerBuilder.html b/website/static/javadoc/com/facebook/litho/Component.ContainerBuilder.html
index 73f2171dc6f..6c96c6be6b3 100644
--- a/website/static/javadoc/com/facebook/litho/Component.ContainerBuilder.html
+++ b/website/static/javadoc/com/facebook/litho/Component.ContainerBuilder.html
@@ -281,7 +281,7 @@ <h4>alignContent</h4>
 <div class="block">The AlignSelf property has the same options and effect as AlignItems but instead of affecting
  the children within a container, you can apply this property to a single child to change its
  alignment within its parent. See <a
- href="https://yogalayout.com/docs/align-content">https://yogalayout.com/docs/align-content</a>
+ href="https://yogalayout.dev/docs/align-content">https://yogalayout.dev/docs/align-content</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#AUTO"><code>YogaAlign.AUTO</code></a></div>
@@ -297,7 +297,7 @@ <h4>alignItems</h4>
 <div class="block">The AlignItems property describes how to align children along the cross axis of their
  container. AlignItems is very similar to JustifyContent but instead of applying to the main
  axis, it applies to the cross axis. See <a
- href="https://yogalayout.com/docs/align-items">https://yogalayout.com/docs/align-items</a>
+ href="https://yogalayout.dev/docs/align-items">https://yogalayout.dev/docs/align-items</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#STRETCH"><code>YogaAlign.STRETCH</code></a></div>
@@ -332,7 +332,7 @@ <h4>justifyContent</h4>
  container. For example, you can use this property to center a child horizontally within a
  container with FlexDirection = Row or vertically within one with FlexDirection = Column. See
  <a
- href="https://yogalayout.com/docs/justify-content">https://yogalayout.com/docs/justify-content</a>
+ href="https://yogalayout.dev/docs/justify-content">https://yogalayout.dev/docs/justify-content</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaJustify.html#FLEX_START"><code>YogaJustify.FLEX_START</code></a></div>
@@ -362,7 +362,7 @@ <h4>wrap</h4>
  <p>The next line will have the same FlexDirection as the first line and will appear next to
  the first line along the cross axis - below it if using FlexDirection = Column and to the
  right if using FlexDirection = Row. See <a
- href="https://yogalayout.com/docs/flex-wrap">https://yogalayout.com/docs/flex-wrap</a> for
+ href="https://yogalayout.dev/docs/flex-wrap">https://yogalayout.dev/docs/flex-wrap</a> for
  more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaWrap.html#NO_WRAP"><code>YogaWrap.NO_WRAP</code></a></div>
diff --git a/website/static/javadoc/com/facebook/litho/Row.Builder.html b/website/static/javadoc/com/facebook/litho/Row.Builder.html
index 55db4c2b47e..6520a1542b3 100644
--- a/website/static/javadoc/com/facebook/litho/Row.Builder.html
+++ b/website/static/javadoc/com/facebook/litho/Row.Builder.html
@@ -292,7 +292,7 @@ <h4>alignContent</h4>
 <div class="block">The AlignSelf property has the same options and effect as AlignItems but instead of affecting
  the children within a container, you can apply this property to a single child to change its
  alignment within its parent. See <a
- href="https://yogalayout.com/docs/align-content">https://yogalayout.com/docs/align-content</a>
+ href="https://yogalayout.dev/docs/align-content">https://yogalayout.dev/docs/align-content</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#AUTO"><code>YogaAlign.AUTO</code></a></div>
@@ -313,7 +313,7 @@ <h4>alignItems</h4>
 <div class="block">The AlignItems property describes how to align children along the cross axis of their
  container. AlignItems is very similar to JustifyContent but instead of applying to the main
  axis, it applies to the cross axis. See <a
- href="https://yogalayout.com/docs/align-items">https://yogalayout.com/docs/align-items</a>
+ href="https://yogalayout.dev/docs/align-items">https://yogalayout.dev/docs/align-items</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaAlign.html#STRETCH"><code>YogaAlign.STRETCH</code></a></div>
@@ -335,7 +335,7 @@ <h4>justifyContent</h4>
  container. For example, you can use this property to center a child horizontally within a
  container with FlexDirection = Row or vertically within one with FlexDirection = Column. See
  <a
- href="https://yogalayout.com/docs/justify-content">https://yogalayout.com/docs/justify-content</a>
+ href="https://yogalayout.dev/docs/justify-content">https://yogalayout.dev/docs/justify-content</a>
  for more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaJustify.html#FLEX_START"><code>YogaJustify.FLEX_START</code></a></div>
@@ -360,7 +360,7 @@ <h4>wrap</h4>
  <p>The next line will have the same FlexDirection as the first line and will appear next to
  the first line along the cross axis - below it if using FlexDirection = Column and to the
  right if using FlexDirection = Row. See <a
- href="https://yogalayout.com/docs/flex-wrap">https://yogalayout.com/docs/flex-wrap</a> for
+ href="https://yogalayout.dev/docs/flex-wrap">https://yogalayout.dev/docs/flex-wrap</a> for
  more information.
 
  <p>Default: <a href="../../../com/facebook/yoga/YogaWrap.html#NO_WRAP"><code>YogaWrap.NO_WRAP</code></a></div>