CSS Rakstu Fona Ģenerators
Veidojiet flīzējamus svītru, punktu, šaha galdiņa, režģa, diagonālā pinuma un trīsstūru fonus no reāliem slāņotiem CSS pāreju slāņiem – bez attēliem – vai eksportējiet to pašu rakstu kā SVG <pattern> izmantošanai SVG dokumentos.
🔒 Pilnībā apstrādāts jūsu pārlūkprogrammā — nekas, ko jūs šeit ievadāt, nekad netiek augšupielādēts.
Rezultāts
Lielākā daļa "rakstu ģeneratoru" rīku klusi izmanto vienu un to pašu atkārtotās lineārās pārejas formulu katrai opcijai un tikai maina skaitļus. Šis to nedara: katrs no sešiem rakstu veidiem šeit ir veidots ar konkrēto CSS tehniku, kas faktiski rada šo formu. Svītras izmanto vienu atkārtotu lineāro pāreju ar divām krāsu joslām. Punkti izmanto vienu radiālo pāreju, kas flīzēta tikai ar background-size – klasiskais CSS punktu triks – nevis atkārtotu radiālo pāreju, kas nevar tīri flīzēt apaļu punktu taisnstūra režģī. Šaha galdiņš izmanto īsto četru kvadrantu koniskās pārejas formulu: koniskā pāreja, centrēta kvadrātveida flīzē, dabiski sadalās četros kvadrantu kvadrātos pie 90 grādu robežām, un, mainot divas krāsas pa šiem kvadrantiem, flīzējas īstā šaha galdiņā, nevis tuvinājumā.
Režģis un diagonālais pinums abi slāņo divas atkārtotas lineārās pārejas kā atsevišķus background-image ierakstus, nevis imitē otro virzienu ar rāmja trikiem. Režģis kombinē "pa labi" un "uz leju" atkārtotu pāreju asām horizontālām un vertikālām līnijām. Pinums slāņo +45° un -45° atkārtotu pāreju groziņa veida diagonālam audumam – ir vērts būt precīzam: tas ir godīgs diagonālais pinums, nevis patiesa skujiņas ģeometrija, un rīks to tā arī apzīmē, nevis pārspīlē. Trīsstūri atkārtoti izmanto šaha galdiņa četru ķīļu koniskās pārejas tehniku, bet sāk pāreju pagrieztu par 45 grādiem, kas pārvieto ķīļu robežas no flīzes malu viduspunktiem uz tās stūriem un pārvērš tos pašus četrus ķīļus par četriem stūra līdz stūrim trīsstūriem, nevis četriem kvadrantu kvadrātiem.
Katrs raksta veids piedāvā tikai tās vadīklas, kas uz to faktiski attiecas – leņķa slīdnis parādās svītrām, punkta rādiuss un atstarpe parādās punktiem, līnijas biezums parādās režģim un diagonālajam pinumam – un lielais flīzētais priekšskatījuma lodziņš pārzīmējas pie katras izmaiņas, lai jūs varētu redzēt vairākus pilnus atkārtojumus, pirms pieņemat vērtību. Pārslēdziet izvades režīmu uz SVG, un tas pats raksts atkal parādās kā <pattern> elements, veidots no vienkāršiem rect, circle, path vai polygon primitīviem, gatavs ielīmēšanai jebkura SVG dokumenta <defs> sadaļā, ar lejupielādi ar vienu klikšķi patstāvīgam .svg failam.
Viss darbojas lokāli jūsu pārlūkprogrammā: nav attēlu augšupielādes, nav servera pieprasījumu, nav konta. Vienkrāsainiem vai pāreju aizpildījumiem bez atkārtošanās šīs vietnes CSS pāreju ģenerators ir pareizais rīks; šis ir īpaši domāts flīzējamiem ģeometriskiem foniem, kas veidoti bez attēlu līdzekļiem.