Geef je ontwikkelworkflow een boost met Gemini, direct geïntegreerd in Chrome DevTools. Stroomlijn debugging met AI-ondersteuning voor styling, prestaties, netwerk en bronnen.

Stijlproblemen kunnen lastig te debuggen zijn. Krijg een gedetailleerde uitleg over de stijlen van je elementen en hulp bij het oplossen van lay-out- en stijlfouten:

Can you center this element?

Aanvraag- en antwoordheaders bevatten vaak belangrijke informatie die niet meteen duidelijk is. Gebruik AI-ondersteuning om dieper op de materie in te gaan:

Why does this request fail?

Het komt zelden voor dat je zelf de hele code voor je website hebt geschreven - weet je niet waar een bepaald script voor gebruikt wordt? AI-assistentie kan helpen:

What is this file used for?

Slechte kernfuncties voor webvitaliteit? Het vinden van de oorzaak van een trage website kan lastig zijn. AI-ondersteuning kan dit voor u onderzoeken en oplossingen voorstellen:

Help me optimize my LCP score

Krijg overal waar u bent AI-assistentie

Zoek naar de knop Vraag AI om hulp van Gemini bij uw huidige taak.

Demo's

Bekijk onze interactieve demo's en ontdek hoe u aan de slag kunt met AI-ondersteuning in uw projecten.
Probeer AI-gestuurde stylingoplossingen om een ​​stilstaand vliegtuig om te toveren tot een zwevend wonder - en zorg er daarbij voor dat je de nodige veiligheidsmaatregelen neemt!
Overwin jij de scrollbar des onheils met AI-assistentie, of blijft een duikteam voor altijd gevangen in een layoutnachtmerrie?

Weet u niet hoe u moet beginnen?

Ontdek snelle ideeën voor AI-ondersteuning in DevTools. Experimenteer met onze demo's of probeer het op je eigen websites.

De beeldverhouding van een afbeelding herstellen

Make all teaser images always be 16:9

Is één van de afbeeldingen niet op dezelfde manier bijgesneden als de anderen?

  • Open de chrome.dev/cinemai/devtools/-pagina en open DevTools .
  • Zoek en selecteer het gedeelte Meer informatie door te kijken .
  • Klik op het AI-assistentiepictogram.
  • Vraag: Make all teaser images always be 16:9 .
  • Klik Apply the suggested change en ga verder.
  • De knop moet gecentreerd zijn.

Een overloopprobleem oplossen

How can I make this element visible?

Element is niet zichtbaar?

  • Open de chrome.dev/cinemai/devtools/-pagina en open DevTools .
  • Zoek een duiker- afbeeldingselement.
  • Klik op het AI-assistentiepictogram.
  • Vraag: How can I make this element visible without scrollbars?
  • Klik Apply the suggested change en ga verder.
  • De duiker moet zichtbaar zijn op het scherm.

Demistify headers

Are there any security headers present?

Wilt u meer weten over de beveiligingsheaders van een bepaalde resource?

  • Open de chrome.dev/cinemai/devtools/-pagina en open DevTools .
  • Selecteer de v4-chrome.dev.js -aanvragen in het paneel Netwerk.
  • Klik op het AI-assistentiepictogram.
  • Vraag: Are there any security headers present?
  • De LLM legt headers uit die betrekking hebben op de beveiliging van de resource.

Diepe duiken

Bekijk video's waarin wordt uitgelegd hoe je AI-ondersteuning in DevTools kunt gebruiken om veelvoorkomende webontwikkelingsproblemen op te lossen.
Ontdek de persistente AI-chatgeschiedenis in Chrome 133-135
Sluit je aan bij Jecelyn, Oliver en Matthias terwijl ze AI-ondersteuning introduceren in Chrome 130-132

Aan de slag

Zorg ervoor dat je de nieuwste versie van Chrome gebruikt en bent aangemeld. Je moet minimaal 18 jaar oud zijn en je op een van de ondersteunde locaties bevinden.
AI-assistentie is standaard uitgeschakeld. Om AI-assistentie in te schakelen, ga je naar Instellingen > AI-assistentie. Je moet akkoord gaan met de Servicevoorwaarden van Google om AI-assistentie te kunnen gebruiken.
Een Enterprise-beleid kan worden gebruikt om te bepalen of de met Gemini gedeelde gegevens worden geregistreerd en gebruikt voor training.

Help ons beter te worden!

Deze functie is experimenteel en kan in de toekomst worden gewijzigd. Het kan onjuiste of aanstootgevende informatie opleveren die niet de mening van Google vertegenwoordigt. Stem op de reacties om ons te helpen de functie te verbeteren en blijf feedback geven!