diff --git a/docs/src/locators.md b/docs/src/locators.md
index b7b6ac6b7e..62101bddeb 100644
--- a/docs/src/locators.md
+++ b/docs/src/locators.md
@@ -102,7 +102,7 @@ page.get_by_role("button", name="Sign in").click()
 await page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
 ```
 
-:::tip
+:::note
 Use the [code generator](./codegen.md) to generate a locator, and then edit it as you'd like.
 :::
 
@@ -262,7 +262,7 @@ Role locators include [buttons, checkboxes, headings, links, lists, tables, and
 
 Note that role locators **do not replace** accessibility audits and conformance tests, but rather give early feedback about the ARIA guidelines.
 
-:::tip When to use role locators
+:::note When to use role locators
 We recommend prioritizing role locators to locate elements, as it is the closest way to how users and assistive technology perceive the page.
 :::
 
@@ -299,7 +299,7 @@ page.get_by_label("Password").fill("secret")
 await page.GetByLabel("Password").FillAsync("secret");
 ```
 
-:::tip When to use label locators
+:::note When to use label locators
 Use this locator when locating form fields.
 :::
 ### Locate by placeholder
@@ -338,7 +338,7 @@ await page
     .FillAsync("playwright@microsoft.com");
 ```
 
-:::tip When to use placeholder locators
+:::note When to use placeholder locators
 Use this locator when locating form elements that do not have labels but do have placeholder texts.
 :::
 
@@ -431,7 +431,7 @@ await Expect(page
 Matching by text always normalizes whitespace, even with exact match. For example, it turns multiple spaces into one, turns line breaks into spaces and ignores leading and trailing whitespace.
 :::
 
-:::tip When to use text locators
+:::note When to use text locators
 We recommend using text locators to find non interactive elements like `div`, `span`, `p`, etc. For interactive elements like `button`, `a`, `input`, etc. use [role locators](#locate-by-role).
 :::
 
@@ -469,7 +469,7 @@ page.get_by_alt_text("playwright logo").click()
 await page.GetByAltText("playwright logo").ClickAsync();
 ```
 
-:::tip When to use alt locators
+:::note When to use alt locators
 Use this locator when your element supports alt text such as `img` and `area` elements.
 :::
 
@@ -505,7 +505,7 @@ expect(page.get_by_title("Issues count")).to_have_text("25 issues")
 await Expect(page.GetByTitle("Issues count")).toHaveText("25 issues");
 ```
 
-:::tip When to use title locators
+:::note When to use title locators
 Use this locator when your element has the `title` attribute.
 :::
 
@@ -541,7 +541,7 @@ page.get_by_test_id("directions").click()
 await page.GetByTestId("directions").ClickAsync();
 ```
 
-:::tip When to use testid locators
+:::note When to use testid locators
 You can also use test ids when you choose to use the test id methodology or when you can't locate by [role](#locate-by-role) or [text](#locate-by-text).
 :::
 
@@ -691,7 +691,7 @@ await page.Locator("#tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > di
 await page.Locator("//*[@id='tsf']/div[2]/div[1]/div[1]/div/div[2]/input").ClickAsync();
 ```
 
-:::tip When to use this
+:::note When to use this
 CSS and XPath are not recommended as the DOM can often change leading to non resilient tests. Instead, try to come up with a locator that is close to how the user perceives the page such as [role locators](#locate-by-role) or [define an explicit testing contract](#locate-by-test-id) using test ids.
 :::
 
diff --git a/docs/src/other-locators.md b/docs/src/other-locators.md
index a45bb3b882..08a8fea70d 100644
--- a/docs/src/other-locators.md
+++ b/docs/src/other-locators.md
@@ -3,7 +3,7 @@ id: other-locators
 title: "Other locators"
 ---
 
-:::tip
+:::note
 Check out the main [locators guide](./locators) for most common and recommended locators.
 :::