Website-Vorlage
Simple Sidebar
An off canvas sidebar navigation Bootstrap HTML template created by Start Bootstrap
Die Beschreibung dieser Vorlage ist noch nicht auf Deutsch verfügbar und wird daher auf Englisch angezeigt.
Website · Kostenlos
Seiten
Screenshots der Live-Demo, Seite für Seite. Scrollen Sie innerhalb einer Seite, um sie ganz zu sehen.
Design-Analyse
Eine KI-Auswertung des Designs dieser Vorlage: Farben, Typografie, Abstände, Abschnitte und markante Details. Ottermind startet damit, wenn Sie die Vorlage verwenden.
Diese Analyse ist noch nicht auf Deutsch verfügbar und wird daher auf Englisch angezeigt.
- Overall
dashboard, clean, low density, light
- Palette
background #ffffff; surfaces [#0d6efd]; text #212529; muted text #636464; primary #0d6efd; accents [#d63384]
- Type
headings system-ui, 500, sentence-case; body system-ui, 16px; scale h1 40px
- Shape & spacing
button radius 6px, no borders, no shadows, section spacing 24px, content width 100% (fluid)
- Sections (top to bottom)
- Top navbar — horizontal layout, 3 items right-aligned (Home, Link, Dropdown), blue toggle button left-aligned, white background, thin top border
- Sidebar — vertical navigation on left, fixed width, light gray background, list items stacked with 1px bottom border, dark text, hover state not visible
- Main content — full-width area with large headline, paragraph text, and inline code snippets in purple, white background, aligned to right of sidebar
- Signature details
- Blue "Toggle Menu" button with rounded corners
- Purple inline code syntax highlighting (#page-content-wrapper, #sidebarToggle)
- Collapsible sidebar behavior indicated by responsive design
- Minimalist layout with ample whitespace
- Fixed-position sidebar with non-overlapping content wrapper
- System UI font stack across all elements
- Other pages
- /dashboard: same structure, different content
- /shortcuts: same structure, different content
- /overview: same structure, different content
- /events: same structure, different content
- /profile: same structure, different content
- /status: same structure, different content
Details zur Vorlage
- Kategorie
- Website
- Technologie
- Bootstrap, HTML5
- Lizenz
- MIT
- Autor
- Start Bootstrap
- Gelistet auf
- Start Bootstrap
- Preis
- Kostenlos
- bootstrap
- bootstrap-4
- bootstrap-5
- bootstrap-5-template
- bootstrap-template
- bootstrap-theme
- bootstrap4
- bootstrap5
- bootstrap5-template
- css
- free
- html
Originaldesign von Start Bootstrap, gelistet auf Start Bootstrap. Ottermind kopiert nicht den Code der Vorlage, sondern erstellt aus dem Briefing eine neue Website.
Das Briefing, mit dem Ottermind startet
Es öffnet sich in Studio als Entwurf – ergänzen Sie Marke, Zielgruppe und Seiten, bevor Sie es senden.
Build a website website inspired by the "Simple Sidebar" template. Reference brief: An off canvas sidebar navigation Bootstrap HTML template created by Start Bootstrap Style and features to reflect: bootstrap, bootstrap-4, bootstrap-5, bootstrap-5-template, bootstrap-template, bootstrap-theme. Use original copy and imagery for my brand rather than the reference's placeholder content.
So verwenden Sie diese Vorlage
- 1
Klicken Sie auf „Diese Vorlage verwenden“, um sie mit ausgefülltem Briefing in Ottermind Studio zu öffnen.
- 2
Ergänzen Sie das Briefing um Marke, Zielgruppe, Seiten und Inhalte.
- 3
Ottermind erstellt eine neue Website, inspiriert von diesem Design – im Chat verfeinern Sie sie weiter.
