
Sidebar Rail
From syxUI — written for both platforms, not translated between them.
A vertical icon sidebar navigation rail.
Navigation · SwiftUI · iOS 17
- navigation
- swiftui
The actual source
SidebarRail.swift
// Sidebar Rail · syxUI · https://syxui.dev/components/nav2-sidebar
// Free in any project. Keep this line and credit syxUI where a person can read it.
import SwiftUI
let navBlue = Color(red: 0.0, green: 0.47, blue: 1.0)
// Vertical sidebar rail
struct SidebarRail: View {
@State private var sel = 0
let icons = ["house.fill", "chart.bar.fill", "folder.fill", "gearshape.fill"]
var body: some View {
VStack(spacing: 20) {
Image(systemName: "hexagon.fill").font(.system(size: 24)).foregroundStyle(navBlue)
ForEach(Array(icons.enumerated()), id: \.offset) { i, ic in
Image(systemName: ic).font(.system(size: 19)).foregroundStyle(sel == i ? .white : Color.secondary).frame(width: 44, height: 44).background(sel == i ? navBlue : .clear, in: RoundedRectangle(cornerRadius: 12)).onTapGesture { sel = i }
}
Spacer()
Image(systemName: "person.crop.circle.fill").font(.system(size: 30)).foregroundStyle(.secondary)
}.padding(.vertical, 18).frame(width: 72, height: 340).background(Color.primary.opacity(0.03), in: RoundedRectangle(cornerRadius: 20))
}
}
iOS 17 · No dependencies
Dependencies
- SwiftUI
- No external dependencies
Requires iOS 17


