diff --git a/wormhole-connect/src/views/v2/Bridge/Routes/SingleRoute.tsx b/wormhole-connect/src/views/v2/Bridge/Routes/SingleRoute.tsx
index 7199056f5..3793a4c10 100644
--- a/wormhole-connect/src/views/v2/Bridge/Routes/SingleRoute.tsx
+++ b/wormhole-connect/src/views/v2/Bridge/Routes/SingleRoute.tsx
@@ -264,9 +264,19 @@ const SingleRoute = (props: Props) => {
   }, [quote]);
 
   const routeCardHeader = useMemo(() => {
-    return typeof receiveAmount === 'undefined' ? (
-      <CircularProgress size={18} />
-    ) : (
+    if (props.error) {
+      return <Typography color="error">Route is unavailable</Typography>;
+    }
+
+    if (props.isFetchingQuote) {
+      return <CircularProgress size={18} />;
+    }
+
+    if (receiveAmount === undefined) {
+      return null;
+    }
+
+    return (
       <Typography>
         {receiveAmount} {destTokenConfig.symbol}
       </Typography>
@@ -274,12 +284,16 @@ const SingleRoute = (props: Props) => {
   }, [destToken, receiveAmount]);
 
   const routeCardSubHeader = useMemo(() => {
-    if (typeof receiveAmount === 'undefined') {
+    if (props.error || !destChain) {
+      return null;
+    }
+
+    if (props.isFetchingQuote) {
       return <CircularProgress size={18} />;
     }
 
-    if (!destChain) {
-      return <></>;
+    if (receiveAmount === undefined) {
+      return null;
     }
 
     const receiveAmountPrice = calculateUSDPrice(
diff --git a/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx b/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx
index 67f80d596..ee1e57a8f 100644
--- a/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx
+++ b/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx
@@ -108,12 +108,18 @@ const Routes = ({ sortedSupportedRoutes, ...props }: Props) => {
         const isSelected = routeConfig.name === props.selectedRoute;
         const quoteResult = quotesMap[name];
         const quote = quoteResult?.success ? quoteResult : undefined;
+        // Default message added as precaution, as 'Error' type cannot be trusted
+        const quoteError =
+          quoteResult?.success === false
+            ? quoteResult?.error?.message ??
+              `Error while getting a quote for ${name}.`
+            : undefined;
         return (
           <SingleRoute
             key={name}
             route={routeConfig}
             available={available}
-            error={availabilityError}
+            error={availabilityError || quoteError}
             isSelected={isSelected}
             onSelect={props.onRouteChange}
             quote={quote}