Slate Form Section
A professional legal consultation request form with formal, trustworthy design.
Features
- Slate blue-gray palette — #475569 primary with crisp white backgrounds
- Google Fonts: Newsreader + Geist — Elegant serif headings with modern sans body
- Structured form — First/last name, email, phone, case type selector, message area
- 10 practice areas — Select dropdown with legal specialization options
- Trust indicators — Confidential, 24h Response, Free Consult badges with icons
- Pinstripe background — Subtle CSS repeating-gradient pinstripe pattern
- Required field markers — Red asterisks on mandatory fields
- Privacy notice — Terms/Privacy links in footer
- Light/dark mode — #F8FAFC light, #1E293B dark with appropriate contrast
- WCAG AA compliant — All text and interactive elements meet minimum contrast ratios
Dependencies
@/components/vue-ui/card — Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter
@/components/vue-ui/button — Button for form submission
@/components/vue-ui/input — Input for text fields
@/components/vue-ui/label — Label for form field labels
@/components/vue-ui/textarea — Textarea for message field
@/components/vue-ui/select — Select, SelectTrigger, SelectValue, SelectContent, SelectItem
@/components/vue-ui/separator — Separator between form sections
lucide-vue-next — Scale, Shield, Clock, FileText, Phone, Mail, Send
Customization