{ "name": "Lukáš Chylík", "url": "https://lukaschylik.dev/", "defaultLanguage": "sk", "languages": [ "sk", "en" ], "generatedAt": "2026-10-25T13:49:02.962Z", "profile": { "name": "Lukáš Chylík", "headline": "Creative AI Engineer with an overlap into frontend and UX/UI. Design Systems and AI in development.", "about": [ "I'm a Creative AI Engineer with a strong overlap into frontend and UX/UI. Over the past 10 years I've worked on projects ranging from presentation websites to PWAs and information systems. Technical SEO and accessibility come as standard. I focus on implementing design systems as well as using AI effectively in development.", "I help teams use AI effectively with a focus on productivity and code quality. I share my experience through consulting, workshops, and training.", "Beyond development, I also speak at various meetups and conferences." ], "location": "Hybešova 308/61, 602 00 Brno, Czech Republic", "email": "chylik.lukas@gmail.com", "phone": "+421721459889", "companyId": "05483247", "website": "https://lukaschylik.dev/en/", "social": [ { "network": "Link to my LinkedIn", "url": "https://www.linkedin.com/in/lukas-chylik/" }, { "network": "Link to the CSS CzechoSlovakia Discord", "url": "https://discord.gg/yXfUhRjx" }, { "network": "Link to my CodePen", "url": "https://codepen.io/luko248" }, { "network": "Link to my GitHub", "url": "https://github.com/Luko248" } ], "siteLanguages": [ "sk", "en" ] }, "content": { "sk": { "description": "Creative AI Engineer s presahom do frontendu a UX/UI, zameraný na AI vo vývoji a Design Systémy.", "home": "https://lukaschylik.dev/", "services": [ { "id": "consulting", "title": "Konzultácie a Mentoring", "price": { "amount": 1200, "currency": "CZK", "unit": "hour" }, "description": "Riešim konkrétne technické problémy, posúvam developerov vpred prostredníctvom personalizovaného mentoringu a robím technologický audit kódu.", "includes": [ "Riešenie konkrétnych frontend problémov", "Code review a architektonické poradenstvo", "Audit kódu a architektúry", "Online aj osobné stretnutia" ], "howToOrder": "Book a 60-minute consultation with the open_booking tool." }, { "id": "workshops", "title": "AI workshopy a školenia", "price": "Dohodou", "description": "AI workshopy a školenia zamerané na prax a produktivitu.", "includes": [ "Spec driven development", "Custom AI agenti", "Tvorba Agent SKILLS a automatizácia procesov", "AI frontend workflow", "Skupinové aj individuálne formáty" ], "howToOrder": "Ask for a quote with the send_contact_message tool." }, { "id": "speaking", "title": "Keynote Speaker", "price": "Free", "description": "Prednášam na meetupoch a konferenciách o Design systémoch, CSS, AI a frontend workflows.", "includes": [ "Prednáška na mieru podľa témy na meetupe či konferencii", "Praktické ukážky z reálnych projektov", "Q&A a diskusia po prednáške" ], "howToOrder": "Send an invitation with the send_contact_message tool." } ], "references": [ { "name": "Vertice", "category": "Design System", "url": "https://vertice.one/" }, { "name": "VIGo", "category": "Design System", "url": "https://vig.cz/" }, { "name": "Riganti", "category": "Spolupráca", "url": "https://www.riganti.cz/" }, { "name": "Update Conference", "category": "Spolupráca", "url": "https://www.updateconference.net/" }, { "name": "DotVVM", "category": "Spolupráca", "url": "https://www.dotvvm.com/" }, { "name": "ANEW STYLE", "category": "Web", "url": "https://anewstyle.cz/" }, { "name": "Crystal Interiors", "category": "Web", "url": "https://www.crystalinteriors.cz/" }, { "name": "Vila SCALA", "category": "Web", "url": "https://www.vila-scala.cz/" }, { "name": "Brand DESIGN", "category": "Web", "url": "https://brand-design.cz/" } ], "sessions": [ { "title": "Frontkec podcast: State of CSS 2026", "videoUrl": "https://www.youtube.com/watch?v=yEoe8-nnVhQ" }, { "title": "Figma Beyond Design: Automatizácia design-to-code workflow", "videoUrl": "https://www.youtube.com/watch?v=MCVuRMBOXUU" }, { "title": "Konzistentné AI agentic workflow naprieč vývojovými tímami", "videoUrl": "https://www.youtube.com/watch?v=FAbaIpGWmR4" }, { "title": "CSS scroll-state container queries", "videoUrl": "https://www.youtube.com/watch?v=eTjXcx5DUqM" }, { "title": "CSS scroll driven animations", "videoUrl": "https://www.youtube.com/watch?v=ITDfqStMym0" }, { "title": "Frontendové novinky Máj 2025", "videoUrl": "https://www.youtube.com/watch?v=hwhuSdO5fU0" }, { "title": "CSS anchor positioning", "videoUrl": "https://www.youtube.com/watch?v=p8sQyt4YFdk" } ], "blogPosts": [ { "slug": "css-view-transitions", "title": "CSS View Transitions", "subtitle": "Od základov v CSS až po element-scoped transitions", "description": "View Transitions API prináša natívne animácie prechodov medzi stavmi stránky. Od CSS-only MPA prechodov po JavaScript riadené SPA animácie a nové element-scoped transitions v Chrome 147+.", "date": "2026-04-07", "author": "Lukáš Chylík", "readingTimeMinutes": 15, "url": "https://lukaschylik.dev/blog/articles/css-view-transitions/", "podcastUrl": "https://open.spotify.com/episode/2lvjOWYXTNpw2KrY0DEvDn?si=b2df5b3c94414cf0" }, { "slug": "figma-beyond-design", "title": "Figma Beyond Design", "subtitle": "Figma API, Variable Code Syntax, Code Connect a MCP server ako nástroje na automatizáciu design-to-code workflow.", "description": "Ako využiť Figma API, Variable Code Syntax, Code Connect a MCP server na automatizáciu design tokenov a generovanie production-ready komponent.", "date": "2026-02-05", "author": "Lukáš Chylík", "readingTimeMinutes": 11, "url": "https://lukaschylik.dev/blog/articles/figma-beyond-design/", "podcastUrl": "https://open.spotify.com/episode/053yvGxs7NSChv904gD951?si=3bb7734d0ba440ea" }, { "slug": "css-specificita-cascade-layers-scope", "title": "CSS Cascade Layers, @scope a moderné selektory", "subtitle": "Ako vrstvy, scope a nové pseudo-classy menia pravidlá kaskády", "description": "Specificita bola vždy základným kameňom CSS. Dnes k nej pribúdajú cascade layers, @scope a moderné selektory ako :has() či :where(), ktoré zásadne menia spôsob, akým skladáme štýly.", "date": "2025-11-16", "author": "Lukáš Chylík", "readingTimeMinutes": 7, "url": "https://lukaschylik.dev/blog/articles/css-specificita-cascade-layers-scope/", "podcastUrl": "https://open.spotify.com/episode/4QXPzTaXJUBxKbcaZ05VcY?si=UGKTjxpOSRqFXEta01yHTg" }, { "slug": "css-carousels", "title": "CSS Carousel", "subtitle": "Nové CSS pseudo-classy :scroll-button, :scroll-marker a :scroll-marker-group", "description": "Scroll Spy navigácia či tabs komponenta bez JavaScriptu a prístupne? Zabudnite na komplexné JavaScript knižnice! CSS carousel je gamechanger.", "date": "2025-10-05", "author": "Lukáš Chylík", "readingTimeMinutes": 10, "url": "https://lukaschylik.dev/blog/articles/css-carousels/", "podcastUrl": "https://open.spotify.com/episode/4v3h6nMI3EvCCo7NVkuoCP?si=98844f163e7a482e" }, { "slug": "farby-na-webe-v-roku-2025", "title": "Farby na webe v roku 2025", "subtitle": "OKLCH, relative colors a CSS color-mix()", "description": "Web design prešiel v roku 2025 revolúciou vo farbách. Zatiaľ čo tradičné RGB a HSL formáty stále dominujú, nové CSS funkcie ako OKLCH, relative colors a color-mix() prinášajú web developerom bezprecedentné možnosti práce s farbami.", "date": "2025-08-07", "author": "Lukáš Chylík", "readingTimeMinutes": 6, "url": "https://lukaschylik.dev/blog/articles/farby-na-webe-v-roku-2025/", "podcastUrl": "https://open.spotify.com/episode/3BIqlTa23zku7mOsLISrIr?si=992bb522c6644257" }, { "slug": "css-container-scroll-state-queries", "title": "CSS container scroll-state queries", "subtitle": "Nový spôsob ako reagovať na stav scrollovania v CSS", "description": "Objavte, ako môžete pomocou CSS container scroll-state queries vytvárať interaktívne prvky reagujúce na scrollovanie bez použitia JavaScriptu.", "date": "2025-07-14", "author": "Lukáš Chylík", "readingTimeMinutes": 6, "url": "https://lukaschylik.dev/blog/articles/css-container-scroll-state-queries/", "podcastUrl": "https://open.spotify.com/episode/7MCsBrsSFOBMTcQxNLdFTB?si=02T7dOEWS2WhRA5_3p0tbA" }, { "slug": "css-scroll-driven-animations", "title": "CSS scroll-driven animácie", "subtitle": "Revolúcia webových animácií bez JavaScriptu", "description": "Zabudnite na knižnice ako ScrollReveal, AOS alebo Scroll Magic! Moderné CSS ich hravo strčí do vrecka.", "date": "2025-04-28", "author": "Lukáš Chylík", "readingTimeMinutes": 7, "url": "https://lukaschylik.dev/blog/articles/css-scroll-driven-animations/", "podcastUrl": "https://open.spotify.com/episode/084tRwRmMQYPGmMhW1Dekc?si=7kr_hZw3TrS6hOFsPg_4Fw" } ] }, "en": { "description": "Creative AI Engineer with an overlap into frontend and UX/UI, focused on AI in development and Design Systems.", "home": "https://lukaschylik.dev/en/", "services": [ { "id": "consulting", "title": "Consulting & Mentoring", "price": { "amount": 1200, "currency": "CZK", "unit": "hour" }, "description": "I solve specific technical problems, help developers grow through personalized mentoring and perform technology audits of code.", "includes": [ "Solving specific frontend problems", "Code reviews and architecture consulting", "Code and architecture audits", "Online and in-person sessions" ], "howToOrder": "Book a 60-minute consultation with the open_booking tool." }, { "id": "workshops", "title": "AI Workshops & Training", "price": "Negotiable", "description": "AI workshops and training focused on practice and productivity.", "includes": [ "Spec driven development", "Custom AI agents", "Building Agent SKILLS and automating processes", "AI frontend workflow", "Group and individual formats" ], "howToOrder": "Ask for a quote with the send_contact_message tool." }, { "id": "speaking", "title": "Keynote Speaker", "price": "Free", "description": "I speak at meetups and conferences about design systems, CSS, AI and frontend workflows.", "includes": [ "A talk tailored to the topic of your meetup or conference", "Practical examples from real projects", "Q&A and discussion after the talk" ], "howToOrder": "Send an invitation with the send_contact_message tool." } ], "references": [ { "name": "Vertice", "category": "Design System", "url": "https://vertice.one/" }, { "name": "VIGo", "category": "Design System", "url": "https://vig.cz/" }, { "name": "Riganti", "category": "Collaboration", "url": "https://www.riganti.cz/" }, { "name": "Update Conference", "category": "Collaboration", "url": "https://www.updateconference.net/" }, { "name": "DotVVM", "category": "Collaboration", "url": "https://www.dotvvm.com/" }, { "name": "ANEW STYLE", "category": "Web", "url": "https://anewstyle.cz/" }, { "name": "Crystal Interiors", "category": "Web", "url": "https://www.crystalinteriors.cz/" }, { "name": "Vila SCALA", "category": "Web", "url": "https://www.vila-scala.cz/" }, { "name": "Brand DESIGN", "category": "Web", "url": "https://brand-design.cz/" } ], "sessions": [ { "title": "Frontkec podcast: State of CSS 2026", "videoUrl": "https://www.youtube.com/watch?v=yEoe8-nnVhQ" }, { "title": "Figma Beyond Design: Automating the design-to-code workflow", "videoUrl": "https://www.youtube.com/watch?v=MCVuRMBOXUU" }, { "title": "A consistent AI agentic workflow across development teams", "videoUrl": "https://www.youtube.com/watch?v=FAbaIpGWmR4" }, { "title": "CSS scroll-state container queries", "videoUrl": "https://www.youtube.com/watch?v=eTjXcx5DUqM" }, { "title": "CSS scroll driven animations", "videoUrl": "https://www.youtube.com/watch?v=ITDfqStMym0" }, { "title": "Frontend news May 2025", "videoUrl": "https://www.youtube.com/watch?v=hwhuSdO5fU0" }, { "title": "CSS anchor positioning", "videoUrl": "https://www.youtube.com/watch?v=p8sQyt4YFdk" } ], "blogPosts": [ { "slug": "css-view-transitions", "title": "CSS View Transitions", "subtitle": "From CSS fundamentals to element-scoped transitions", "description": "The View Transitions API brings native animated transitions between page states. From CSS-only MPA transitions to JavaScript-driven SPA animations and the new element-scoped transitions in Chrome 147+.", "date": "2026-04-07", "author": "Lukáš Chylík", "readingTimeMinutes": 18, "url": "https://lukaschylik.dev/en/blog/articles/css-view-transitions/", "podcastUrl": "https://open.spotify.com/episode/2lvjOWYXTNpw2KrY0DEvDn?si=b2df5b3c94414cf0" }, { "slug": "figma-beyond-design", "title": "Figma Beyond Design", "subtitle": "Figma API, Variable Code Syntax, Code Connect and MCP server as tools for automating the design-to-code workflow.", "description": "How to use the Figma API, Variable Code Syntax, Code Connect and MCP server to automate design tokens and generate production-ready components.", "date": "2026-02-05", "author": "Lukáš Chylík", "readingTimeMinutes": 12, "url": "https://lukaschylik.dev/en/blog/articles/figma-beyond-design/", "podcastUrl": "https://open.spotify.com/episode/053yvGxs7NSChv904gD951?si=3bb7734d0ba440ea" }, { "slug": "css-specificita-cascade-layers-scope", "title": "CSS Cascade Layers, @scope and Modern Selectors", "subtitle": "How layers, scope and new pseudo-classes are changing the rules of the cascade", "description": "Specificity has always been a cornerstone of CSS. Today it is joined by cascade layers, @scope and modern selectors like :has() and :where(), which fundamentally change the way we compose styles.", "date": "2025-11-16", "author": "Lukáš Chylík", "readingTimeMinutes": 9, "url": "https://lukaschylik.dev/en/blog/articles/css-specificita-cascade-layers-scope/", "podcastUrl": "https://open.spotify.com/episode/4QXPzTaXJUBxKbcaZ05VcY?si=UGKTjxpOSRqFXEta01yHTg" }, { "slug": "css-carousels", "title": "CSS Carousel", "subtitle": "New CSS pseudo-classes :scroll-button, :scroll-marker and :scroll-marker-group", "description": "Scroll Spy navigation or a tabs component without JavaScript, and accessible? Forget complex JavaScript libraries! The CSS carousel is a gamechanger.", "date": "2025-10-05", "author": "Lukáš Chylík", "readingTimeMinutes": 11, "url": "https://lukaschylik.dev/en/blog/articles/css-carousels/", "podcastUrl": "https://open.spotify.com/episode/4v3h6nMI3EvCCo7NVkuoCP?si=98844f163e7a482e" }, { "slug": "farby-na-webe-v-roku-2025", "title": "Colors on the Web in 2025", "subtitle": "OKLCH, relative colors and CSS color-mix()", "description": "Web design went through a color revolution in 2025. While traditional RGB and HSL formats still dominate, new CSS features like OKLCH, relative colors and color-mix() give web developers unprecedented ways to work with color.", "date": "2025-08-07", "author": "Lukáš Chylík", "readingTimeMinutes": 6, "url": "https://lukaschylik.dev/en/blog/articles/farby-na-webe-v-roku-2025/", "podcastUrl": "https://open.spotify.com/episode/3BIqlTa23zku7mOsLISrIr?si=992bb522c6644257" }, { "slug": "css-container-scroll-state-queries", "title": "CSS container scroll-state queries", "subtitle": "A new way to react to scroll state in CSS", "description": "Discover how CSS container scroll-state queries let you build interactive elements that respond to scrolling without using JavaScript.", "date": "2025-07-14", "author": "Lukáš Chylík", "readingTimeMinutes": 7, "url": "https://lukaschylik.dev/en/blog/articles/css-container-scroll-state-queries/", "podcastUrl": "https://open.spotify.com/episode/7MCsBrsSFOBMTcQxNLdFTB?si=02T7dOEWS2WhRA5_3p0tbA" }, { "slug": "css-scroll-driven-animations", "title": "CSS scroll-driven animations", "subtitle": "A revolution in web animations without JavaScript", "description": "Forget libraries like ScrollReveal, AOS or Scroll Magic! Modern CSS puts them all to shame with ease.", "date": "2025-04-28", "author": "Lukáš Chylík", "readingTimeMinutes": 8, "url": "https://lukaschylik.dev/en/blog/articles/css-scroll-driven-animations/", "podcastUrl": "https://open.spotify.com/episode/084tRwRmMQYPGmMhW1Dekc?si=7kr_hZw3TrS6hOFsPg_4Fw" } ] } }, "agentAccess": { "llmsTxt": "https://lukaschylik.dev/llms.txt", "sitemap": "https://lukaschylik.dev/sitemap.xml", "structuredData": "Every indexable page embeds a schema.org JSON-LD @graph (Person, WebSite, page type, BreadcrumbList, BlogPosting).", "webmcp": { "spec": "https://webmachinelearning.github.io/webmcp/", "imperativeTools": [ { "name": "get_page_context", "description": "Describe the page the visitor is currently viewing on lukaschylik.dev: URL, language, title, color theme and the list of destinations accepted by the navigate tool. Call this first to orient yourself.", "readOnly": true }, { "name": "get_profile", "description": "Get public information about Lukáš Chylík, the owner of this portfolio: frontend developer with UX/UI overlap focused on design systems and AI in development. Returns bio, location, email, phone, company ID and social profiles.", "readOnly": true }, { "name": "list_services", "description": "List the services Lukáš offers (consulting & mentoring, AI workshops & training, conference speaking) with descriptions, pricing and how to order each one.", "readOnly": true }, { "name": "list_references", "description": "List selected client projects and collaborations (design systems, collaborations and websites) with links.", "readOnly": true }, { "name": "list_sessions", "description": "List recordings of conference and meetup talks given by Lukáš (modern CSS, frontend, Figma, AI workflows) with YouTube links.", "readOnly": true }, { "name": "search_blog_posts", "description": "List or search blog articles (newest first) about CSS, frontend, design systems and AI. Matches all query words against title, subtitle and description. Returns slug, metadata and URL; use get_blog_post with the slug to read the full article.", "readOnly": true }, { "name": "get_blog_post", "description": "Get the metadata and the full plain-text content of a blog article by its slug (from search_blog_posts). Useful for summarizing or answering questions about an article.", "readOnly": true }, { "name": "navigate", "description": "Navigate the visitor to a page or home page section of the site, keeping the current language.", "readOnly": false }, { "name": "open_blog_post", "description": "Open a blog article in the current language so the visitor can read it.", "readOnly": false }, { "name": "set_theme", "description": "Switch the site between light and dark mode. The choice is remembered.", "readOnly": false }, { "name": "set_language", "description": "Reload the current page in another language: \"sk\" (Slovak) or \"en\" (English). Tools re-register after the page loads.", "readOnly": false }, { "name": "open_booking", "description": "Open the booking calendar for a paid 60-minute consulting session with Lukáš. The visitor picks the date and time themselves in the calendar.", "readOnly": false }, { "name": "send_contact_message", "description": "Send a message to Lukáš through the site contact form, e.g. a project inquiry, workshop request or speaking invitation. The visitor sees the full message and must confirm before it is sent.", "readOnly": false }, { "name": "subscribe_newsletter", "description": "Subscribe an email address to the newsletter about new articles. The visitor must confirm before subscribing.", "readOnly": false } ], "declarativeForms": [ { "toolname": "contact_form", "page": "https://lukaschylik.dev/#contact" }, { "toolname": "newsletter_signup", "page": "https://lukaschylik.dev/blog/" } ] }, "policy": "Agents may read all content and prefill forms. The visitor must review and confirm every message or subscription before it is sent." } }