- Published on
- 1 min read
> Creating a WebView with a transparent background in SwiftUI
- Authors

- Name
- Mick MacCallum
- @0x7fs
To create a WebView with a transparent background in SwiftUI, we can use a UIViewRepresentable to wrap a WKWebView. We need to set the isOpaque property to false and the backgroundColor property to .clear to achieve a transparent background.
import SwiftUI
import WebKit
struct TransparentWebView: UIViewRepresentable {
private let request: URLRequest
init(
url: URL,
cachePolicy: URLRequest.CachePolicy = .useProtocolCachePolicy,
timeoutInterval: TimeInterval = 60.0
) {
request = URLRequest(
url: url,
cachePolicy: cachePolicy,
timeoutInterval: timeoutInterval
)
}
func makeUIView(context: Context) -> WKWebView {
let webview = WKWebView()
webview.load(request)
webview.allowsLinkPreview = false
webview.allowsBackForwardNavigationGestures = false
webview.isOpaque = false
webview.scrollView.backgroundColor = .clear
webview.backgroundColor = .clear
return webview
}
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.reload()
}
}
// Continue_Learning
How to display a GIF from a URL in SwiftUI
Learn how to use a WKWebView as a quick way to load a GIF from a URL and display it in a SwiftUI view.
SwiftUI vs UIKit: Which Should You Choose in 2026?
A practical guide to choosing between SwiftUI and UIKit in 2026, based on your project requirements, team experience, and the current state of both frameworks.
Accessing the Camera Roll in SwiftUI
Learn how to access photos from the camera roll in SwiftUI, including required permissions, Info.plist configuration, and using PhotosPicker for iOS 16+ or UIImagePickerController for earlier versions.
// Stay Updated
Get notified when I publish new tutorials on Swift, SwiftUI, and iOS development. No spam, unsubscribe anytime.