Biblioteca de componentes
Explora todos los componentes de UI disponibles organizados por nivel de diseno atomico. Cada componente usa tokens de tema y soporta i18n.
AppleIcon
atoms/AppleIcon.astro Reusable Apple logo SVG atom
AuroraBackground
atoms/AuroraBackground.astro Animated aurora borealis glow with drifting gradient blobs
Avatar
atoms/Avatar.astro Circular user avatar with image, initials fallback, and optional status indicator
Badge
atoms/Badge.astro Small label atom for tags, versions, and status indicators
BlurFade
atoms/BlurFade.astro Elements fade in from a blurred state when scrolled into view
BorderBeam
atoms/BorderBeam.astro Animated beam of light tracing an element border
Checkbox
atoms/Checkbox.astro Themed checkbox atom with label support and animated check indicator
CubeFlipIcon
atoms/CubeFlipIcon.astro Reusable 3D cube-rotate icon swap atom
Divider
atoms/Divider.astro Horizontal or vertical separator with optional label text
DynamicPreview
atoms/DynamicPreview.astro Renders a component dynamically from a module reference
FaqIcon
atoms/FaqIcon.astro Animated plus/cross icon for FAQ accordion toggle
FeatureIcon
atoms/FeatureIcon.astro Animated Lordicon icon atom for the features grid
GlowEffect
atoms/GlowEffect.astro Pulsing concentric radial-gradient glow behind slotted content
GridPattern
atoms/GridPattern.astro SVG-based tiling grid or dot pattern background
Heading
atoms/Heading.astro Semantic heading atom with consistent typography scale
Heading 1
Heading 2
Heading 3
Heading 4
HeroAppleLogo
atoms/HeroAppleLogo.astro Inline Apple logo SVG atom for the hero heading
Input
atoms/Input.astro Form text input atom with label, helper text, and error state support
Kbd
atoms/Kbd.astro Keyboard key indicator styled to resemble a physical keycap
NumberTicker
atoms/NumberTicker.astro Animated number that counts up from 0 to a target value
Particles
atoms/Particles.astro Canvas-based floating particle background effect
ProgressBar
atoms/ProgressBar.astro Determinate horizontal progress indicator with optional label
Radio
atoms/Radio.astro Themed radio button atom with label support and animated dot indicator
RssLink
atoms/RssLink.astro RSS feed link atom with an icon and label
ScrollProgress
atoms/ScrollProgress.astro A thin progress bar indicating page scroll position
Select
atoms/Select.astro Dropdown select atom with label, helper text, and error state support
ShineBorder
atoms/ShineBorder.astro Animated shining border effect using a rotating conic-gradient
Skeleton
atoms/Skeleton.astro Animated placeholder for loading states with a shimmer sweep effect
Spotlight
atoms/Spotlight.astro Cursor-following radial gradient that illuminates content on hover
Text
atoms/Text.astro Paragraph atom with variant and size options
Large bold text
Default base text.
Muted base text for secondary content.
Small muted text for captions.
Textarea
atoms/Textarea.astro Multi-line text input atom with label, helper text, and error state support
TextGenerate
atoms/TextGenerate.astro Text that appears word by word with a fade-up animation effect
TextScramble
atoms/TextScramble.astro Text that scrambles through random characters before resolving to the final string
TextShimmer
atoms/TextShimmer.astro Text with an animated shimmer/shine sweep effect
Toggle
atoms/Toggle.astro Themed toggle/switch atom with label support and smooth slide animation
Tooltip
atoms/Tooltip.astro Contextual hint that appears on hover/focus via CSS-only positioning
TypeWriter
atoms/TypeWriter.astro Typewriter effect that types text character by character with a blinking cursor
Watermark
atoms/Watermark.astro Decorative gradient-text watermark atom
Accordion
molecules/Accordion.astro Expandable content sections with smooth height animation
Alert
molecules/Alert.astro Status message banner with variant-specific accent colors
BlogCard
molecules/BlogCard.astro Molecule for displaying a blog post preview in the list
Featured
Introducing Landing v1.6
A showcase of what a blog card looks like with sample data.
Default
Card
molecules/Card.astro Generic content card with multiple visual variants
Confetti
molecules/Confetti.astro Canvas-based celebration burst with physics simulation
Drawer
molecules/Drawer.astro Premium slide-in panel with cinematic entrance and accent details
FaqItem
molecules/FaqItem.astro Accordion item molecule for FAQ pages
What is this component?
An accordion item with smooth grid-row animation for FAQ pages.
FeatureCard
molecules/FeatureCard.astro Molecule combining a FeatureIcon with a title
Lightning Fast
HeroCTA
molecules/HeroCTA.astro Hero call-to-action molecule with download and purchase buttons
Marquee
molecules/Marquee.astro Infinite horizontal scrolling content band with a premium feel
Modal
molecules/Modal.astro Premium dialog overlay with cinematic open/close animations
TableOfContents
molecules/TableOfContents.astro Renders h2/h3 headings as a nested list with anchor links
Tabs
molecules/Tabs.astro Premium tabbed content switcher with floating pill indicator
Content for Design tab.
Content for Develop tab.
Content for Deploy tab.
TiltCard
molecules/TiltCard.astro A 3D card that follows the cursor with tilt, glare, and shadow depth effects
WallpaperPreview
molecules/WallpaperPreview.astro Decorative lock screen mockup molecule
ComparisonSection
organisms/ComparisonSection.astro Minimalist feature comparison table
Por que elegir Landing?
Mira como Landing se compara con la experiencia de notificaciones predeterminada de Mac.
FeaturesGrid
organisms/FeaturesGrid.astro Organism displaying a grid of animated feature cards
Funciones
Transiciones fluidas
Notificaciones instantaneas
Actividades en vivo
Gestos deslizantes
Lleno de sorpresas
HUDs personalizables
Widgets de pantalla de bloqueo
App nativa ultrarapida
Header
organisms/Header.astro Fixed site header organism with logo and nav
HeroSection
organisms/HeroSection.astro Primary landing organism with headline, CTA buttons,
Dynamic Island
para Mac
LogoCloudSection
organisms/LogoCloudSection.astro Cinematic scrolling logo cloud with dual-row marquee
Usado por equipos en empresas lideres
Unete a miles de profesionales que han mejorado su experiencia Mac.
PricingSection
organisms/PricingSection.astro Minimalist pricing organism with clean card layout
Precios simples y transparentes
Sin cargos ocultos. Sin sorpresas. Elige el plan que mejor te funcione.
Gratis
Perfecto para probar
- Notificaciones basicas
- Dynamic Island estandar
- Soporte comunitario
- 1 dispositivo
Pro
Todo lo que necesitas para tu Mac
- Todos los tipos de notificacion
- HUDs y widgets personalizados
- Actividades en vivo
- Soporte prioritario
- Hasta 3 dispositivos
- Actualizaciones de por vida
Equipo
Para equipos y organizaciones
- Todo lo de Pro
- Licencias por volumen
- 10+ dispositivos
- Soporte dedicado
- Despliegue personalizado
- Panel de administracion
StatsSection
organisms/StatsSection.astro Animated statistics organism with NumberTicker counters
Creciendo cada dia
Landing es confiado por una comunidad de usuarios de Mac en rapido crecimiento en todo el mundo.
Usuarios activos
Calificacion App Store
Tiempo activo
Tiempo de respuesta prom.
TestimonialsSection
organisms/TestimonialsSection.astro Auto-scrolling testimonial cards in a marquee layout
Amado por usuarios de Mac en todas partes
Mira lo que la gente dice sobre su experiencia con Landing.
Landing transformo completamente como interactuo con mi Mac. El Dynamic Island se siente como si siempre hubiera estado ahi.
Sarah Chen
Disenadora de producto, Figma
Como desarrollador, aprecio el rendimiento. Menos del 0.5% de uso de CPU y hace mi flujo de trabajo mucho mas fluido.
Marcus Rodriguez
Ingeniero Senior, Vercel
La atencion al detalle es increible. Cada animacion, cada interaccion — todo se siente nativo y pulido.
Emily Park
Directora Creativa, Linear
Landing transformo completamente como interactuo con mi Mac. El Dynamic Island se siente como si siempre hubiera estado ahi.
Sarah Chen
Disenadora de producto, Figma
Como desarrollador, aprecio el rendimiento. Menos del 0.5% de uso de CPU y hace mi flujo de trabajo mucho mas fluido.
Marcus Rodriguez
Ingeniero Senior, Vercel
La atencion al detalle es increible. Cada animacion, cada interaccion — todo se siente nativo y pulido.
Emily Park
Directora Creativa, Linear
Lo compre el primer dia y no he mirado atras. La funcion de actividades en vivo por si sola vale la pena.
James O'Brien
Escritor Freelance, Independiente
Finalmente, un Dynamic Island para Mac que realmente funciona. Los HUDs personalizables son un cambio total.
Aisha Patel
Desarrolladora iOS, Apple
Hermoso, rapido y discreto. Asi es como las notificaciones deberian funcionar en cada plataforma.
Thomas Weber
Investigador UX, Stripe
Lo compre el primer dia y no he mirado atras. La funcion de actividades en vivo por si sola vale la pena.
James O'Brien
Escritor Freelance, Independiente
Finalmente, un Dynamic Island para Mac que realmente funciona. Los HUDs personalizables son un cambio total.
Aisha Patel
Desarrolladora iOS, Apple
Hermoso, rapido y discreto. Asi es como las notificaciones deberian funcionar en cada plataforma.
Thomas Weber
Investigador UX, Stripe
SocialIcon
atoms/SocialIcon.astroClickable social media icon atom