Frontend-Herausforderung: Weltraum.

Ich arbeite noch daran, wollte aber versuchen, öffentlich zu bauen. Das Codepen-Fenster schneidet Teile des Bildes ab. Klicken Sie daher auf die Schaltfläche „.5x“.

Dies ist eine Einreichung für Frontend Challenge v24.09.04, CSS Art: Space.

Inspiration

Die Herausforderung war der Weltraum, also begann ich mit dem Hintergrund für den Weltraum. Ich wollte kein reines Schwarz, also habe ich mit etwas schwarzem, blauem und violettem Hintergrund gespielt: linearer Farbverlauf. Am Ende hatte ich etwas Schöneres als das nüchterne #000-Schwarz.

Demo

Hier ist mein Codepen. Wenn ich fertig bin, werde ich vielleicht dazu übergehen, den Code einfach hier zu posten.

Das Codepen-Fenster schneidet Teile des Bildes ab. Klicken Sie daher auf die Schaltfläche „.5x“.

Reise

Ich habe Code von der Sommer-Challenge wiederverwendet, bei der ich den Sonnenuntergang am Strand gezeichnet habe. Der Farbverlauf in der Sonne erinnerte mich an den roten Fleck auf Jupiter.

Ich habe einen Punkt hinzugefügt, indem ich mit mehr Farben gespielt habe. Ich wollte nicht das eigentliche Sonnensystem machen, sondern eine stilisiertere Version des Weltraums. Ursprünglich wollte ich, dass sich die Planeten überlappen.

Als ich den gelben Planeten erstellt habe, gab ihm das Weiß mehr Tiefe. Deshalb habe ich eine Hervorhebung über dem jupiterähnlichen Planeten hinzugefügt.

Als nächstes fügte ich eine Wurmlochöffnung hinzu, die es Schiffen ermöglichte, in die Galaxie einzudringen. Das Wurmloch ist ein Oval mit Transformation: Schräge, um dem Loch etwas Tiefe zu verleihen.

Einpacken

Ich mag diese Frontend-Herausforderungen wirklich. Es ist immer schön, bei Projekten etwas Kreativität zu zeigen.

Das obige ist der detaillierte Inhalt vonFrontend-Herausforderung: Weltraum.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!