Project Status NoticeAviso de Estado del Proyecto
This website is not a final product. We built this website to demonstrate our skills in neurodivergent-friendly web design.Este sitio web no es el producto final. Creamos este sitio para mostrar nuestra habilidad en el desarrollo de diseños web adaptados a personas neurodivergentes.
Accessibility Settings
Customize how this website looks and behaves to match your visual and sensory preferences. All settings apply instantly and will be saved for your next visit.
Reduces sensory intensity by turning off page animations, hiding decorative items, increasing space between sections, and using low-saturation colors.
Helps with focus by dimming all other sections on the page. The section you hover over or place keyboard focus on will highlight automatically.
Design System & Readability Showcase
This component showcases typography hierarchy, reading limits, and card groupings. When you modify settings in the control panel, observe how the text blocks, borders, and margins adjust to accommodate your preferences.
Typography and Content Hierarchy
Below is a sequence of nested titles. A proper hierarchy helps individuals with ADHD or dyslexia scan information easily without feeling overwhelmed.
Level 4 Heading (h4)
This text sits under a Level 4 heading. It uses a line-width limit of approximately 70 characters. Limiting line length reduces visual tracking strain, preventing readers from getting lost when moving their eyes from the end of one line to the beginning of the next.
Text is left-aligned. Fully justified text creates uneven spaces between words, which is known to cause visual distraction and disruption for readers with reading differences.
Accessible Action Targets
Buttons here demonstrate the minimum 44×44px touch target rule. They feature highly visible, custom focus rings when tabbed to, and avoid high-saturation color flashes.
Sensory Distractions
This card showcases decoration management. Toggle **Calm Mode** on to see how decorative background bubbles and extra details fade away instantly to keep the visual field clear.
Decorative elements: Active (Visually present)Hidden (Calm Mode active)
Structured Grouping
Information grouped into distinct boxes with border dividers rather than unstructured walls of text.
- Item 1: Plain Language explanations first
- Item 2: Maximum 70 characters line width
- Item 3: Generous padding around all items