diff --git a/@theme/styles.css b/@theme/styles.css
index 1281a9a9bd..a478affefd 100644
--- a/@theme/styles.css
+++ b/@theme/styles.css
@@ -260,6 +260,8 @@ ul.nav.navbar-nav {
   --link-color-primary: #fff;
   --link-color-visited: #fff;
   --link-color-primary-hover: #9a52ff;
+  
+  --search-highlight-text-color: #4BB7FF; /* color-blue-4 */
 }
 
 :root .form-control-plaintext {
diff --git a/resources/dev-tools/rpc-tool.page.tsx b/resources/dev-tools/rpc-tool.page.tsx
index da0649add9..19da095277 100644
--- a/resources/dev-tools/rpc-tool.page.tsx
+++ b/resources/dev-tools/rpc-tool.page.tsx
@@ -205,17 +205,19 @@ export default function RpcTool() {
                   "This is a debug tool for printing raw information about an account (by classic address), a transaction (by hash) or a ledger (by sequence number)."
                 )}
               </p>
-              <input
-                onChange={(event) => setInputText(event.target.value)}
-                value={inputText}
-                id="target"
-                className="form-control"
-                required
-                type="text"
-                placeholder={translate(
-                  "XRP Ledger address, transaction ID, or ledger index"
-                )}
-              />
+              <div className="input-group">
+                <input
+                  onChange={(event) => setInputText(event.target.value)}
+                  value={inputText}
+                  id="target"
+                  className="form-control"
+                  required
+                  type="text"
+                  placeholder={translate(
+                    "XRP Ledger address, transaction ID, or ledger index"
+                  )}
+                />
+              </div>
               <span className="help-block">
                 <small>
                   {translate("resourses.rpc-tool.help-block.part1", "Try an account like ")}